获取元素在jquery中触发onclick事件?

Max*_*ams 43 javascript jquery

我有一个表单,我用输入(带有type =按钮)替换了提交按钮,其中onclick调用现有函数:

<form accept-charset="UTF-8" action="/admin/message_campaigns" class="new_message_campaign" id="new_message_campaign" method="post">
  <!-- some fields -->
      <input onclick="confirmSubmit();" type="button" value="Send" />
</form>
Run Code Online (Sandbox Code Playgroud)

在confirmSubmit中,我希望能够动态获取表单对象(提交它),而不必对表单的id进行硬编码,或者将其作为调用confirmSubmit()的一部分传递.我以为我可以通过首先获得点击的dom元素来做到这一点,即:

var form = $(this).parents("form");
Run Code Online (Sandbox Code Playgroud)

其中$(this)是调用函数的对象,即onclick的输入.但这不起作用.我认为这,如果我用它设置工作.click(function(){的语法.我能以不同的方式获得调用函数的元素吗?

编辑 - 从下面的@claudio得到答案,为清楚起见这里是完整的功能和电话:

<form accept-charset="UTF-8" action="/admin/message_campaigns" class="new_message_campaign" id="new_message_campaign" method="post">
  <!-- some fields -->
      <input onclick="confirmSubmit($(this));" type="button" value="Send" />
</form>
Run Code Online (Sandbox Code Playgroud)

和功能本身.请注意,'jConfirm'是jquery-alerts插件的一种方法(http://abeautifulsite.net/blog/2008/12/jquery-alert-dialogs/),但这与此问题并不真正相关 - 关键是获取表单对象,而不是随后使用它做的事情:

function confirmSubmit(caller) {
  var form = caller.parents("form");
  jConfirm('Are you sure?', 'Please Confirm', function(result){
    if (result) {
      form.submit();
    } else {
      return false;
    }
  });
}
Run Code Online (Sandbox Code Playgroud)

Cla*_*dio 65

您可以传递内联处理程序this关键字,获取触发事件的元素.

喜欢,

onclick="confirmSubmit(this);"
Run Code Online (Sandbox Code Playgroud)

  • 得到它:只需要"jqueryfy"调用者:`confirmSubmit(调用者){var form = $(调用者).parents("form");` (5认同)
  • 调用者是一个DOM元素,所以你需要为.parents('form')做confirmSubmit($(this))才能工作. (4认同)

Coi*_*_op 40

如果您不想通过参数将单击的元素传递给函数,则需要访问正在发生的事件对象,并从该对象获取目标.如果您像这样绑定click事件,这是最容易完成的:

$('#sendButton').click(function(e){
    var SendButton = $(e.target);
    var TheForm = SendButton.parents('form');
    TheForm.submit();

    return false;
});
Run Code Online (Sandbox Code Playgroud)


Rya*_*yan 23

试试这个

<input onclick="confirmSubmit(event);" type="button" value="Send" />
Run Code Online (Sandbox Code Playgroud)

随之而来

function confirmSubmit(event){
            var domElement =$(event.target);
            console.log(domElement.attr('type'));
        }
Run Code Online (Sandbox Code Playgroud)

我在firefox中尝试过它,它打印了dom Element点击的'type'属性.我想你可以使用这个对象通过parents()方法获取表单.


Jer*_*ski 7

这是google stackoverflow问题,但所有答案都不是jQuery相关的!

$(".someclass").click(
    function(event)
    {
        console.log(event, this);
    }
);
Run Code Online (Sandbox Code Playgroud)

'event'包含两个重要值:

event.currentTarget - 触发事件的元素('.someclass'元素)

event.target - 单击元素(如果在'.someclass'[div]内部是其他元素而你点击了它们)

this - 设置为触发元素('.someclass'),但它是JavaScript元素,而不是jQuery元素,所以如果你想在它上面使用一些jQuery函数,你必须先将它改为jQuery元素:$(this)