Javascript 两个jquery提交，每个提交一个操作

我对JS/jquery非常陌生（我是一名后端开发人员），在实现某些东西时遇到了困难。我正在使用Django，有一个模板，其中有一个文本区域，当按下

enter

按钮时，需要有一个提交事件。下面是我如何实现的

<div class="search multi-search">
    {% if search_str %}
        <textarea name="search_str" id="search_str">{{ search_str }}</textarea>
    {% else %}
        <textarea name="search_str" id="search_str" placeholder="Search by Lead ID's or email addresses separated by a comma."></textarea>
    {% endif %}
        <button id="thebutton" type="submit" class="btn btn-icon btn-large btn-inverse"><i class="icon-search"></i></button>
</div>


<script>
    // overriding the default enter action to submit the
    // search string on enter instead
    $('#search_str').keydown(function(e){
        // checks to see if the key pressed is the enter key and submit.
        // (13 is the code for the enter key)
        if (e.which == 13) {
            e.preventDefault();
            $('#leads_form').submit();
        }
    })
</script>

---

submit

事件只能绑定到特定类型的元素。 从jQuery api文档：

当用户尝试提交时，提交事件被发送到元素 提交一份表格。它只能附加到

元素。表格可以 通过单击显式，

或

，或按Enter键 当某些表单元素具有焦点时

因此，尝试将按钮的

type

属性更改为“submit”，看看是否有效

更好的是，只需给表单标记一个id，然后尝试将其附加到提交事件

如果有帮助，请告诉我：）

。单击（）

效果明显。但是，按enter键将触发提交操作，该操作将发布表单。相反，将按钮类型更改为submit，并阻止submit事件的默认操作。这将处理您可能触发提交表单的任何操作

<div id='give-reason' style="display: none">
    <p>Give your reason for this change.</p>
    <form>
        <input type="text" id="reason">
        <button type='submit' id='reason-submit'>Submit your reason</button>
    </form>
</div>

$('#reason-submit').submit(function(event){
    event.preventDefault();
    var lead_data = gather_lead_status($(this), update_type, true);
    var reason = $('#reason').val();
    lead_data(reason);
    $.fancybox.close();
    e.preventDefault();
});

给出你改变的理由

提交你的理由
$（“#原因提交”）.submit（函数（事件）{
event.preventDefault（）；
var lead\u data=收集lead\u状态（$（此），更新类型，true）；
var reason=$（'#reason'）.val（）；
lead_数据（原因）；
$.fancybox.close（）；
e、 预防默认值（）；
});

<div class="search multi-search">
   {% if search_str %}
       <textarea name="search_str" id="search_str">{{ search_str }}</textarea>
   {% else %}
       <textarea name="search_str" id="search_str" placeholder="Search by Lead ID's or email addresses separated by a comma."></textarea>
   {% endif %}
   <button id="thebutton" type="submit" class="btn btn-icon btn-large btn-inverse"><i class="icon-search"></i></button>
</div>

<div id='give-reason' style="display: none">
    <p>Give your reason for this change.</p>
    <form id='reason-submit'>
        <input type="text" id="reason">
        <button type='submit'>Submit your reason</button>
    </form>
</div>

<script>
    // overriding the default enter action to submit the
    // search string on enter instead
    $('#search_str').keydown(function(e){
        // checks to see if the key pressed is the enter key and submit.
        // (13 is the code for the enter key)
        if (e.which == 13) {
            e.preventDefault();
            $('#leads_form').submit();
        }
    })

    $('#reason-submit').submit(function(e){
        e.preventDefault();
        var lead_data = gather_lead_status($(this), update_type, true);
        var reason = $('#reason').val();
        lead_data(reason);
        $.fancybox.close();
    });
</script>

<div id='give-reason' style="display: none">
    <p>Give your reason for this change.</p>
    <form>
        <input type="text" id="reason">
        <button type='submit' id='reason-submit'>Submit your reason</button>
    </form>
</div>

$('#reason-submit').submit(function(event){
    event.preventDefault();
    var lead_data = gather_lead_status($(this), update_type, true);
    var reason = $('#reason').val();
    lead_data(reason);
    $.fancybox.close();
    e.preventDefault();
});