Question

function getRandom(){return Math.ceil(Math.random()* 20);}

function createSum(){
	var randomNum1 = getRandom(),
			randomNum2 = getRandom();
	total =randomNum1 + randomNum2;
	$( "#question" ).text( randomNum1 + " + " + randomNum2 + "=" );
    

  $("#ans").val('');
  checkInput();
}

function checkInput(){
		var input = $("#ans").val(), 
    	slideSpeed = 200,
      hasInput = !!input, 
      valid = hasInput && input == total;
	  
    $('#message').toggle(!hasInput);
    $('button[type=submit]').prop('disabled', !valid);  
    $('#success').toggle(valid);
    $('#fail').toggle(hasInput && !valid);
}

$(document).ready(function(){
	//create initial sum
	createSum();
	// On "reset button" click, generate new random sum
	$('button[type=reset]').click(createSum);
	// On user input, check value
	$( "#ans" ).on('input', checkInput);
});

var recognition = new webkitSpeechRecognition();
recognition.continuous = true;

var output = document.getElementById('ans');
recognition.onresult = function(event) {
  output.textContent = event.results[0][0].transcript;
};

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="question"></p><input id="ans" type="text">
			<div id="message">Please verify.</div>
			<div id="success">Validation complete :)</div>
			<div id="fail">Validation failed :(</div>
      
<button onclick="recognition.start()">Start</button>
<button onclick="recognition.stop()">Stop</button>

我有一个功能，可以检查天气输入是否正确，在检查输入后会发出完整或失败的消息。

<p id="question"></p><input id="ans" type="text">
<div id="message">Please verify.</div>
<div id="success">Validation complete :)</div>
<div id="fail">Validation failed :(</div>

我在keyup事件的帮助下检查输入。

$(document).ready(function(){
createSum();
$('button[type=reset]').click(createSum);
// On user input, check value
$( "#ans" ).keyup(checkInput);    // keyup event
});

这段代码运行正常。但我决定使用语音到文本API而不是键盘输入来通过语音输入。现在我的checkInput函数没有运行，因为没有keyup事件。我的查询是这个事件的替代品，如果它在输入框中找到一个值，它可以运行我的checkInput函数。

我试过onchange但它似乎没有用。

Answer 1

//我认为这可能有助于你

recognition.onspeechend = function() {
  iput
}

用一些输入检测事件jquery替换keyup事件

1 个答案: