单击我网站中的图像时的文本到语音

Question

我尝试在我的站点中将此文字转语音。

https://www.youtube.com/watch?v=DOtkNxmg9QY

我希望当我点击 nanogallery2 中的播放（自定义 1）按钮时将这段文字语音化。

带有哈巴狗的 nanogallery 代码 (home.pug)

script(type='text/javascript'src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js')
link(href='https://unpkg.com/nanogallery2/dist/css/nanogallery2.min.css' rel='stylesheet' type='text/css')
script(type='text/javascript' src='https://unpkg.com/nanogallery2/dist/jquery.nanogallery2.min.js')

#my_nanogallery2(data-nanogallery2=
{
    "items": categ,
    "itemsBaseURL": "/users/",
    "locationHash": false,
    "thumbnailWidth": "250",
    "thumbnailHeight": "250",
    "thumbnailBorderVertical": 4,
    "thumbnailBorderHorizontal": 4,
    "colorScheme":
    {
        "thumbnail":
        {
            "background": 'rgba(97, 152, 253, 1)',
            "thumbnailIcon" : { "color": '#FFF'}
        }
    },
    "thumbnailLabel":
    {
        "position": "onBottom",
        "titleFontSize": '1.5em'
    },
    "thumbnailAlignment": "center",
    "thumbnailDisplayTransitionDuration": 0,
    "thumbnailDisplayInterval": 3,
    "thumbnailHoverEffect2": null,
    "thumbnailToolbarImage":      { topLeft: 'custom1'},
    "thumbnailToolbarAlbum":      { topLeft: 'custom1'},
    "icons":                      { thumbnailCustomTool1 : '<i  class="fa fa-play-circle" style="font-size:24px"></i>'},
    "fnThumbnailToolCustAction":  SoundCustom,
    "thumbnailOpenImage": false })

这个选项添加到我的 nanogallery 一个按钮，当我点击按钮时 "soundcustom" 功能应该工作。

"thumbnailToolbarImage":      { topLeft: 'custom1'},
"thumbnailToolbarAlbum":      { topLeft: 'custom1'},
"icons":                      { thumbnailCustomTool1 : '<i  class="fa fa-play-circle" style="font-size:24px"></i>'},
"fnThumbnailToolCustAction":  SoundCustom,

这是home.js

中的函数"soundcustom"

 function SoundCustom(item){
    console.log(item.title);
    var text;
    text = encodeURIComponent(item.title);
    console.log(text);
    var url = "http://translate.google.com/translate_tts?tl=en&q=" + text + "&client=tw-ob";
    $('audio').attr('src', url).get(0).play();
}

我正在尝试放置控制台日志以查看我是否获得了值。结果我什么也没得到

当然按按钮也没有反应

此外，当我尝试添加他们在视频中提供的脚本时，它破坏了纳米画廊。

不知道有没有关系

谢谢

Answer 1

经过多次尝试..失败是将值输入到nanogallery。

"fnThumbnailToolCustAction": 声音自定义,

收件人：

"fnThumbnailToolCustAction": "SoundCustom",

希望其他人不要上当。

单击我网站中的图像时的文本到语音

text to speech when click on image in my site

javascript

jquery

text-to-speech