Question

我通过onclick属性在元素本身中调用一个函数，因为我需要php在函数的一个参数中动态给出一个值。当我尝试通过$(this)引用函数中的调用元素时，它最终引用整个窗口而不是元素。我该如何解决？

Answer 1

尝试将您的元素作为参数发送到您的函数：

<input type="text" onclick="myfunction(this);"></input>

你的功能应该是：

<script>
  function myfunction(currentElement){
    // ...
  }
</script>

Answer 2

我怀疑你确实需要使用内联onclick属性。您可以通过各种不同的方式将数据存储在元素中。如果不知道你需要传递什么参数，很难确切地说你会怎么做，但我会给出一些例子。

最灵活的可能是data-属性：

<a href="#" id="subject" data-type="fiction">Text</a>

然后您可以通过以下方式访问信息：

$(document).ready(function(){
    $('#subject').click(function(){
        $type = $(this).data('type'); // this works as of jQuery 1.4.3, otherwise $(this).attr('data-type');

        // do your handling here, using $type
    });
});

您也可以使用类，创建全局变量的脚本标记，各种方法来完成此操作。这几乎肯定比将jQuery处理程序放在onclick属性中更好。

Answer 3

解决方案是将动态值存储在自定义属性中，而不是onclick处理程序。 HTML规范定义了以“data-”开头的任何属性，因为自定义数据完全用于这样的事情，并且它在规范中，因此它将验证。所以你可以做这样的事情（使用PHP作为例子，相应地调整）：

<input type="text" id="some-input" data-some-dynamic="<?php echo $something; ?>">

然后在javascript中检索如下：

$(document).ready(function() {
  $('#some-input').click(function() {
    // $(this) -- is the input element
    // $(this).attr('some-dynamic-attribute') -- contains the dynamic data you need
  });
});

我认为这种方法优于使用像onclick =“”这样的属性处理程序，这很简单，因为从设计的角度看它更加坚固;分离关注点和所有这些。

Jquery：选择调用该函数的元素

3 个答案: