Use x-webkit-speech in an HTML/JavaScript extensio

2019-03-25 09:57发布

站内问答 / Html5
721 3 6

I am trying to use the new x-webkit-speech function in a simple HTML/JavaScript extension in Google Chrome. I, however, have tried and tried looking at a bunch of examples and cannot get it to successfully call the function. I have seen other people do it, and I don't really get why I cannot. I put the JavaScript code into a separate file, but I include using <script src="filename.js"> this is my line for the x-webkit-speech....

<input id="speechInput" type="text" style="font-size:25px;" x-webkit-speech speech onwebkitspeechchange="onChange()" />

Now, if I change onChange() to alert(this.value), it executes an alert box with the value of the speech input in it. So I really do not understand why I cannot just call another function. I am not the greatest JavaScript or HTML programmer, but I have researched this a great deal. Everyone defines things differently, and since there is no solid API, it is hard to really know who has the correct form, because they all seem to work somehow.

My onChange function looks like

function onChange() { alert("in onChange"); }

I am just trying to test and make sure it's going to the function, but I get nothing.

3条回答
劳资没心，怎么记你
2楼-- · 2019-03-25 10:12 
if (document.createElement("input").webkitSpeech === undefined) {
    alert("Speech input is not supported in your browser.");
}

you can use this code

查看更多
0人赞 添加讨论(0) 举报
The star\"
3楼-- · 2019-03-25 10:18

I was playing around with this feature today and actually your code seems to be OK and works for me. The full version would be the following:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Speech</title>
</head>

<script type="text/javascript" charset="utf-8">
    function onChange() {
        alert('changed');
    }
</script>

<body>

    <input id="speechInput" type="text" style="font-size:25px;"
           x-webkit-speech onwebkitspeechchange="onChange()" />

</body>
</html>

Though I did notice that onChange() does not get called if Chrome fails to recognize the speech. I'm using Chrome 11.0.696.28 beta. Also the speech attribute is not necessary if you're targeting only webkit-based browsers like Chrome or Safari. And even if you leave it in, it doesn't work with Firefox 4. Not sure about IE9 since I don't have it.

查看更多
0人赞 添加讨论(0) 举报
爱情/是我丢掉的垃圾
4楼-- · 2019-03-25 10:24

Dont worry, just try following it should help

<!DOCTYPE html> 
<html>
<meta charset="utf-8" />  
<title>Speech Input Test</title>  
<h2>Speech Input Test</h2>
<input id="speech-input-field" type="text" x-webkit-speech="">
<html>
查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(6)