如何使用jquery .on()提交检测输入按钮值

时间:2012-11-02 19:09:47

标签: jquery input submit

如何使用jquery .on()提交检测此表单上的哪个输入按钮?

<form name="input" action="none" method="post">
 <input type="text" name="user">
 <input id="submit" type="submit" value="Submit">
 <input id="cancel" type="submit" value="Cancel">
</form>​​​​​​​​​​​​​​​



$('body').on('submit', 'form', function(e) {
      console.log($(this).attr("value"));
      return false;})

这里有一个jsfiddle示例http://jsfiddle.net/dansalmo/suZHg/

我看了很多地方并尝试了很多不同的方法来尝试检测.on()方法中的输入提交按钮值但我无法得到它。

在我的示例中$(this).attr(“value”)和$(this).val()出现未定义

然后我想能够使用ajax提交表单,所以只是检测按钮不是这个问题的重点。如果没有办法使用。(on)提交,那么知道与使用不涉及表单提交的备用按钮检测方法进行回答相反会有所帮助。

5 个答案:

答案 0 :(得分:4)

我没有看到提交处理程序获取此信息的任何方法,但您可以从按钮单击事件中获取信息,然后在提交事件中使用它。

$('body').on('submit', 'form', function(e) {
      console.log($(this).data('clicked'));
      return false;
});
$('form').on('click', 'input[type=submit]', function(e) {
      $(this.form).data('clicked', this.value);
});

http://jsfiddle.net/suZHg/15/

答案 1 :(得分:1)

您可以拦截提交按钮的点击事件,然后手动触发表单提交,传入对原始按钮的引用:

        $("input:submit").on("click", function () {
            $("form[name='input']").trigger("submit", this);
            return false;
        });

        $('body').on('submit', 'form', function (e, button) {
            console.log($(button).val());
            return false;
        })

答案 2 :(得分:0)

$("input[type='submit']").click(function(e) {
      console.log($(this).val());
      return false;
});

答案 3 :(得分:-1)

$(this)对应form此处..

而不是已提交的button

试试这个

$('body').on('click', 'input[type="submit"]', function(e) {
    e.preventDefault();
    console.log($(this).attr('value'));
    return false;
})​

答案 4 :(得分:-1)

$('input:submit').click(function(){alert(this.id); return false;});