Question

HTML

<form>
  <input type="radio" name="category" value="doctor" /> Doctor
  <input type="radio" name="category" value="police" checked /> Policia
</form>

JS

var category = null;
$("input[name='category']").click(function() {
    category = this.value;
    alert(category);
});

当您单击单选按钮时，会立即收到响应。但是，当您在外部JavaScript文件中具有相同的脚本时。它不起作用。上面的代码在两个html文件中都有效。

如果我在不同的文件中做同样的事情，比如index.html和jscript.js

的index.html

<html>
<head>
<script type="text/javascript" src="jscript.js"></script>
</head>
<body>
  <form>
  <input type="radio" name="category" value="doctor" /> Doctor
  <input type="radio" name="category" value="police" checked /> Policia
</form>
</body>
</html>

jscript.js

var category = null;
$("input[name='category']").click(function() {
    category = this.value;
    alert(category);
});

这不起作用。

Answer 1

将deffer属性添加到脚本导入中。它会在你的html被所有浏览器支持后执行js REF： http://www.w3schools.com/tags/att_script_defer.asp

或者，如果您使用的是jQuery，请确保在onready函数中添加所有处理程序：

$(document).ready(function(){
var category = null;
$("input[name=category]").click(function() { // you don;t need quotes here for category name
    category = this.value;
    alert(category);
});
});

Answer 2

您可能需要在外部文件中添加jquery .load函数：

$(window).load(function() {
    var category = null;
    $("input[name='category']").click(function() {
        category = this.value;
        alert(category);
    });
}

Answer 3

在您的html代码下并在关闭body标签之前导入您的js文件。然后运行

Answer 4

这应该做你的工作：

$(document).ready(function(){

//Your code here....

});

导入.js脚本时，单击时无响应

4 个答案: