Question

我已经在StackOverflow上尝试了所有可能的脚本，但没有任何工作。我想将输入键绑定到文本框，单击特定按钮。代码如下所示：

<form>
Enter URL: <input type="text" id="url" />
<input id="button" type="button" value="Load" onclick="loadUrl()" />
</form>
<iframe id="showUrl"></iframe>

按钮导致另一个用于加载URL的脚本（工作正常）。但是当我使用任何javascript或jquery时，没有任何反应，它显示＆＃34;？＆＃34;在主浏览器URL和我的文本框消息链接。

对不起我是编程中的菜鸟，请帮帮我

我的loadUrl（）脚本：

<script type="text/javascript">
function loadUrl() {
var url = document.getElementById( 'url' ).value,
    showUrl = document.getElementById( 'showUrl' );
showUrl.src = /$https?:\/\//.test(url) ? url : 'https://'+url;
}
</script>

Answer 1

以下是Plunker的示例。如果您正确创建表单，则应在按Enter键时自动提交，或单击“转到/提交”按钮。

<head>
  <link rel="stylesheet" href="style.css">

</head>

<body>
  <form id="theForm" method="GET" action="#">
    Link:
    <input type="text" id="url" />
    <input type="submit" id="goButton" value="Go"/>
  </form>
  <iframe id="showUrl"></iframe>
  <script src="script.js"></script>
</body>

</html>

的script.js

var url = document.getElementById('url'),
    showUrl = document.getElementById('showUrl'),
    goButton = document.getElementById('goButton'),
    theForm = document.getElementById('theForm');

function loadUrl(e) {
  e.preventDefault();
  showUrl.src = url.value;
  return false;
}

theForm.addEventListener('submit', loadUrl);

url.addEventListener('keyup', function(e){
  //You shouldn't need this since the form submits when you click enter anyway.
  console.log(e.key);
  console.log(e.which);
  console.log(e.char);  
});

将文本框中的Enter键绑定到特定按钮

1 个答案: