JavaScript：使用值模拟点击

Question

我需要模拟点击，并发送元素的值。 这是因为我需要单击的项目在具有相同ID的页面上多次存在，但我只想触发一个行为。

元素看起来像这样

<input type="submit" value="Login" class="um-button" id="um-submit-btn"> 

到目前为止，我的代码是

$("#user_password-36").on('keyup', function (e) {
    if (e.keyCode == 13) {
        $("#um-submit-btn").click();
    }
});

但是我认为我需要能够发送“登录”值。 否则会触发错误的提交按钮。

我知道这不是一个好的解决方案，但是我需要在不修改运行登录系统的现有代码的情况下完成这项工作。

Answer 1

即使有多个具有相同id的元素是一个坏主意（您的情况是这种用法所带来的问题），但是您可以通过指定值和id来选择它：

$("#um-submit-btn[value='Login']").click();

Answer 2

使用此方法，您可以将keyup处理程序添加到多个元素中，而不只是将一个给定值的按钮添加到其中。 但是， 必须对要将此处理程序附加到的元素使用一个类。 您也可以将类用于其他重复元素。

如果以某种方式，类user_password-36的元素与此按钮共享同一父级：

<div>
    <input class='user_password-36' />
    <input id='um-submit-btn' />
</div>

你可以用这个

$(".user_password-36").on('keyup', function (e) { 
    if (e.keyCode == 13) { 
        $(this).parent().find("#um-submit-btn").click(); 
    } 
});

另外，如果它们以某种方式共享同一父级，但以任何方式嵌套：

<div id='parentId'>
    <div>
        <input class='user_password-36' />
    </div>
    <div>
        <div>
            <input id='um-submit-btn' />
        </div>
    </div>
</div>

然后提供其共同父母的ID（或类）

$(".user_password-36").on('keyup', function (e) { 
    if (e.keyCode == 13) { 
        $(this).parents('#parentId').find("#um-submit-btn").click(); 
    } 
});

Answer 3

您还可以通过使用trigger()触发click事件

$("#um-submit-btn[value='Login']").trigger( "click" );