Question

有没有人有类似的经历？我想在单击图像时获取自定义参数，而不仅仅是id。第二次警报（this.ads）我得到未定义，如何从此参数中获取数字2？

HTML

<section id="home" data-role="page">
    <article data-role="content">
        <div id="home-content">Home Content here <a href="#tab-3" data-transition="slide">Goto Tab-3</a>
        <div id="tab-3-list">
            <div class="ui-grid-a">
                <div class="ui-block-a">
                    <img id="c02" ads="2" class="coupon_list" src="/images/coupon/c02.png">
                </div>
            </div>
            <!-- /ui-grid-a -->
        </div>
        <!-- /tab-3-list -->
        </div>
    </article>
    <!-- content -->
</section>
<!-- home -->

的Javascript

$(document).ready(function () {
    $("#tab-3-list img.coupon_list").on("click", function (e) {
        e.preventDefault();
        alert(this.id);
        alert(this.ads);
    });

});

Answer 1

也许通过使用，

alert($(this).attr('ads'));

它会为您提供自定义属性的值。

编辑：为JavaScript添加自定义属性

如果您想添加自定义属性只是为了您自己的利益，例如在HTML元素中获取更多数据详细信息以供JavaScript进一步使用。

您可以使用data-属性。这将简单易行。这是

的一个例子

<img data-abs="2" src="/images/coupon/c02.png" alt="coupon photo" />

现在，您可以使用.data()方法获取值http://api.jquery.com/data/（数据方法的jQuery API）。

以下是如何使用它

$('img').data('abs'); // output would be 2

Answer 2

“ads”是img-tag的一个属性，因此您可以使用

获取其值

alert($(this).attr("ads"));

jQuery .attr()

Answer 3

将ads替换为data-ads根据HTML5正确无误。

然后使用原生javascript：

this.getAttribute('data-ads');

或jQuery：

$(this).data('ads');
//or
$(this).attr('data-ads');

提取自定义参数

3 个答案:

编辑：为JavaScript添加自定义属性