2

我有形式。我添加两个按钮使用 JQuery。如何获取此按钮的名称？

<form id="frm">
</form>
//JQuery:
    $("#frm").append('<input class="btn" type="submit" name="GoTest"  value="Preview"/>');
    $("#frm").append('<input class="btn" type="submit" name="GoTest1" value="Next"/>'); 
$("#frm").on("click",  function () {
if (this...=="Next")
 {
  alert("It's button Next");
 }else
 {
  alert("It's button Preview");
 }
});
4

7 回答 7

2

在您的问题中，您要求输入名称，但文本“Next”在值中......所以试试这个：

$("#frm").on("click", '.btn',  function (e) {
    e.preventDefault();
    if (this.value=="Next")
     {
          alert("It's button Next");
     }else
     {
          alert("It's button Preview");
     }
});

如果要获取名称，可以$(this).prop('name');在 click 函数中使用。

于 2013-08-16T15:09:50.170 回答
1

You need to use the event delegation syntax of .on():

 $("#frm").append('<input class="btn" type="submit" name="GoTest"  value="Preview"/>');
 $("#frm").append('<input class="btn" type="submit" name="GoTest1" value="Next"/>');

 $('#frm').on('click', '.btn', function () {
     console.log($(this).attr('name'))
 });

jsFiddle example

$(this).attr('name') get's the name as you asked for, however if you want the value, use $(this).val() instead.

于 2013-08-16T15:10:51.927 回答
1 
$("#frm").on("click",  function (event) {
if (event.target.attr("value") === "Next")
 {
  alert("It's button Next");
 }else
 {
  alert("It's button Preview");
 }
});
于 2013-08-16T15:11:07.997 回答
1

The name of the button is not the same as the value of the button.

$("#frm").on("click",  function (ev) {
    alert($(ev.currenTarget).prop('name'));
}
于 2013-08-16T15:11:30.697 回答
1

DEMO: jsFiddle

HTML:

<form id="frm"></form>

JS:

$(function () {
    $("#frm").append('<input class="btn" type="submit" name="GoTest"  value="Preview"/>');
    $("#frm").append('<input class="btn" type="submit" name="GoTest1" value="Next"/>');
    $("#frm > .btn").on("click", function (e) {
        e.preventDefault();
        if ($(this).val() == "Next") {
            alert("It's button Next");
        } else {
            alert("It's button Preview");
        }
    });
});

SIMPLIFIED CODE:

$(function () {
    $("#frm").append('<input class="btn" type="submit" name="GoTest"  value="Preview"/>');
    $("#frm").append('<input class="btn" type="submit" name="GoTest1" value="Next"/>');
    $("#frm > .btn").on("click", function (e) {
        e.preventDefault();

        alert("It's button " + $(this).val());
    });
});

WITHOUT USING CLASS ATTRITBUTE: jsFiddle

$(function () {
    $("#frm").append('<input class="btn" type="submit" name="GoTest"  value="Preview"/>');
    $("#frm").append('<input class="btn" type="submit" name="GoTest1" value="Next"/>');
    $("#frm > [name^='GoTest']").on("click", function (e) {
        e.preventDefault();

        alert("It's button " + $(this).val());
    });
});

Documentation:

[attribute^=value]: All elements with a name attribute value starting with value.

Updated: To use the child property, please note the e.preventDefault() will stop the auto POST of the FORM html tag.

于 2013-08-16T15:12:10.080 回答
1 
if($(this).val() == "Next"){

}
于 2013-08-16T15:09:43.947 回答
0

You can store the name of the button when it is clicked and then detect which button was clicked.

于 2013-08-16T15:12:04.743 回答