1

我有以下代码，我正在尝试开始工作。出于某种原因，它在 JSFiddle 上运行良好，但是当我从服务器提供代码时在文本框中键入时没有任何反应。为什么会这样？

<!DOCTYPE html>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.js"></script>

    <script type="text/javascript">
        $('#userInput').keyup(function(){
            alert("key up");
        });
    </script>
</head>

<body>
    <input id="userInput" type="text">
</body>
</html>
4

5 回答 5

3

您的脚本正在将 keyup 函数附加到尚不存在的元素。您需要将脚本放在页面底部，或者使用$(document).ready(function(){//your code});

于 2013-04-03T00:37:48.313 回答
1

可能是因为您需要将其包装在.ready函数中

$(document).ready(function() {
    $('#userInput').keyup(function(){
        alert("key up");
    });
});
于 2013-04-03T00:35:43.677 回答
1

你的代码应该已经准备好了

$(function(){
        $('#userInput').keyup(function(){
            alert("key up");
        });
});

在 jsfiddle 下的Frameworks & Extensions第二个下拉部分onload默认会被选中，这意味着脚本框架中的所有脚本只有在整个 dom 加载后才会被执行。

但是当我们将该脚本移动到页面时，我们需要使用.ready

演示：问题
演示：解决方案

于 2013-04-03T00:35:47.583 回答
1

您的 JS 代码在 DOM 准备好之前执行。将 JavaScript 放在底部或使用 jQuery $(document).ready()。

于 2013-04-03T00:36:32.870 回答
1 
<!DOCTYPE html>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.js"></script>

    <script type="text/javascript">
    $(function() {
        $('#userInput').keyup(function(){
            alert("key up");
     });
        });
    </script>
</head>

<body>
    <input id="userInput" type="text">
</body>
</html>
于 2013-04-03T00:36:42.947 回答