jquery - 未调用函数

Question

我正在尝试在这个小提琴中测试一些 jQuery ：

<div id="myDiv"></div>
<input name="Button3" type="button" value="Invoke" onclick="get()">

function get() {
    var data = {};
    data.foo = "bar";
    data.stuff = {
        nifty: "stuff"
    };

    $("#myDiv").text(JSON.stringify(data));
}

get()当我按“调用”时，没有调用该函数。应该发生的是div内容应该得到更新。

Answer 1

您的小提琴不起作用的原因是设置错误。onLoad将左侧的下拉菜单更改为no wrap (head)，它将起作用。

但是，由于您将 jQuery 用于您的逻辑，因此最好也使用它来附加事件，而不是使用笨重的onclick属性。试试这个：

<input name="Button3" type="button" value="Invoke" id="button">

$("#button").click(get);

示例小提琴

Answer 2

Jsfiddle 在 windows.load 事件上评估您的函数：

<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
function doSomething() {
    var data = {};
    data.foo = "bar";
    data.stuff = {nifty: "stuff"};

    ("#myDiv").text(JSON.stringify(data));
}

});//]]>  

</script>

但是浏览器需要它在标题上或在引用它的元素之前。

您必须将您的代码更改为：

<div id="myDiv"></div>
<script type="text/javascript" >
    function doSomething() {
    var data = {};
    data.foo = "bar";
    data.stuff = {nifty: "stuff"};

    $("#myDiv").text(JSON.stringify(data));
}
</script>

<input name="Button3" type="button" value="Invoke" onclick="doSomething()">
​

但，

建议使用 jquery 样式的事件附件：

<input id="myBTN" name="Button3" type="button" value="Invoke" />
$('#myBTN').click(function(e){
    // do something
});

Answer 3

给你更新的玩笑

您正在使用 javascript 调用该函数，而您已在 jQuery 库中声明了该函数。

HTML

<div id="myDiv"></div>
<input name="Button3" type="button" value="Invoke">

文档内的脚本已准备就绪

$('input[type=button]').click(function () {
get();
})

function get() {
var data = {};
data.foo = "bar";
data.stuff = {nifty: "stuff"};

$("#myDiv").text(JSON.stringify(data));
}