重定向不起作用，按键盘上的回车键

Question

检查下面的代码。当我在输入字段中输入某个关键字并按Search按钮时，它已成功重定向到 youtube url，但如果我按回车键，那么这不会重定向，但我使用了.click()输入方法。我该如何解决它？我想重定向，按键盘上的回车键，然后按搜索按钮。我该如何解决它？

$(document).ready(function () {
$(document).on("keypress", function(e){
$("#srcBtn").click();
});
$('#srcBtn').on('click', function () {
var srcValue = $('#srcValue').val();
var youtubeUrl = 'https://www.youtube.com/results?search_query=';
//console.log(srcValue);
window.open(youtubeUrl+srcValue,"_self");
});    
});

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" >
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="container">
<form method="get" action="">
<br/>
<br/>
<br/>
<div style="text-align:center;">
<input type="text" class="form-group form-control input-lg" id="srcValue" value="" placeholder="Search YouTube">
<button type="button" class="btn btn-info btn-lg" id="srcBtn">Search</button>
</div>
</form>
</div>    

Answer 1

我更喜欢在函数中执行搜索部分并触发它。而不是一些奇怪的"每个代码点击按钮"。按钮是供人类触发代码的，而不是相反^^

$(document).ready(function () {
$(document).on("keypress", e => {if(e.key == "Enter") searchYoutube()});
$('#srcBtn').on('click', searchYoutube);
function searchYoutube() {
var srcValue = $('#srcValue').val();
var youtubeUrl = 'https://www.youtube.com/results?search_query=';
//console.log(srcValue);
window.open(youtubeUrl+srcValue,"_self");
}
});

Answer 2

而不是调用只是单击请使用触发器("单击"(

$(document).ready(function () {
$(document).on("keypress", function(e){
if(e.key ==  'Enter') {
$("#srcBtn").trigger("click");
}
});

$('#srcBtn').on('click', function () {
var srcValue = $('#srcValue').val();
var youtubeUrl = 'https://www.youtube.com/results?search_query=';
//console.log(srcValue);
window.open(youtubeUrl+srcValue,"_self");
});
});