没有功能参数的不显眼的javascript

Question

如果你有

<div id="data" onclick="handleData(1)">Datum 1</div>

而你想要晚绑定:

<div id="data">Datum 1</div>
<script>
    $("#data").click(function() {
        handleData(1);
    })
</script>

你如何传递参数1？你必须做这样的事情:

<div id="data" data="1">Datum 1</div>
<script>
    $("#data").click(function() {
        handleData($(this).attr("data"););
    })
</script>

Answer 1

我假设你正在使用jQuery.

如果是这样,我将利用jQuery对data-使用data()^(docs)方法的HTML5 属性的支持.它将在所有浏览器中.

<div id="data" data-number="1">Datum 1</div>
<script>
    $("#data").click(function() {
        handleData($(this).data("number"));
    })
</script>

请注意,我将属性更改为data-number,并使用它访问它.data("number").这需要jQuery 1.4.3或稍后.

来自文档:

从jQuery 1.4.3开始,HTML 5数据属性将自动引入jQuery的数据对象.