在 div 中设置 .keyup()答案

【问题标题】：Set .keyup() in a div在 div 中设置 .keyup()
【发布时间】：2016-12-09 16:33:06
【问题描述】：

我在ASP.NET WebForm 上开发了一个系统。由于它不支持多种形式，我使用这些代码在界面中显示为 2 个形式，通过id 获取值并通过ajax 提交值。但在这里我想为 2 个虚拟表单设置 2 个单独的 .keyup() 函数。有可能这样做吗？如果是，那么如何？

<!--First form-->
<div class="x_content form-horizontal form-label-left" id="info">
    <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-12">E-mail</label>
        <div class="col-md-9 col-sm-9 col-xs-12">
            <input type="text" class="form-control required" id="email" placeholder="Enter email" readonly>
        </div>
    </div>
    <br />
    <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-12">Full Name</label>
        <div class="col-md-9 col-sm-9 col-xs-12">
            <input type="text" class="form-control required" id="name" placeholder="Enter full name">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-12">Contact</label>
        <div class="col-md-9 col-sm-9 col-xs-12">
            <input type="text" class="form-control required" id="contact" placeholder="Enter contact">
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-9 col-sm-9 col-xs-12 col-md-offset-3">
            <button type="button" class="btn btn-primary" onclick="verifyInfo()">Submit</button>
            <button type="button" class="btn btn-danger">Cancel</button>
        </div>
    </div>
</div>


<!--Second form-->
<div class="x_content form-horizontal form-label-left" id="pass">
    <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-12">Old Password</label>
        <div class="col-md-9 col-sm-9 col-xs-12">
            <input type="password" class="required form-control" id="oldpassword" placeholder="Type old password">
        </div>
    </div>
    <br>
    <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-12">New Password</label>
        <div class="col-md-9 col-sm-9 col-xs-12">
            <input type="password" class="required form-control" id="newpassword" placeholder="Type new password">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-md-3 col-sm-3 col-xs-12">Re-Type Password</label>
        <div class="col-md-9 col-sm-9 col-xs-12">
            <input type="password" class="required form-control" id="repassword" placeholder="Re-type new password">
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-9 col-sm-9 col-xs-12 col-md-offset-3">
            <button type="button" class="btn btn-primary" onclick="verifyPass()">Submit</button>
            <button type="button" class="btn btn-danger">Cancel</button>
       </div>
    </div>
</div>

【问题讨论】：

简短回答：是/可能。长答案：请显示您的代码，以便我们为此提供上下文:)
我已经给出了我的代码？还有什么要提供的？
你已经给出了部分的代码……JavaScript在哪里？
使用这样的东西：$("#info :input).keyup( function(){...})
您已经给出了您的 HTML 而没有给出任何代码（除了一些诱人的内联函数调用）。请也提供您的代码 :)

标签： jquery asp.net webforms

【解决方案1】：

您可以试一试jQuery Hotkeys。它非常易于使用，并且可以处理您的按键事件。

将 Ctrl+m 绑定到几个函数 [f1 和 f2]，例如：

$('#form1').on('keyup', null, 'ctrl+m', f1);
$('#form2').on('keyup', null, 'ctrl+m', f2);

【讨论】：

从 jQuery 3.0 开始，.bind() 已被弃用。自 jQuery 1.7 起，它被用于将事件处理程序附加到文档的 .on() 方法取代，因此不鼓励使用它。
根据@ZakariaAcharki 的反馈更新为使用“on”语法

【解决方案2】：

在这里我找到了这个问题的 2 个答案。 1 来自fnostro 的评论，

$("#info :input").keyup( function(){...})

另一个是添加 2 个不同的类，每个 :input 有 2 个不同的形式和这个函数。

$('.classname').keyup(function(){
    //
});

【讨论】：