0

可能是一个愚蠢的问题,但请多多包涵:

是否有可能通过使用 jQuery/javascript 来实现,以便当您单击一个按钮时,它会单击/提交多个按钮?

这可能有助于更轻松地回答问题:

<div class="form-item form-type-select form-item-field-status-10-field-status-und-select">
  <select size="0" name="field_status[10][field_status][und][select]" id="edit-field-status-10-field-status-und-select" class="select-or-other-select form-select chzn-done" style="width: 100px; display: none;">
    <option value="">- select -</option>
    <option selected="selected" value="In">In</option>
    <option value="Gym">Gym</option>
    <option value="Lunch">Lunch</option>
    <option value="Out">Out</option>
    <option value="select_or_other">Other</option>
  </select>
  <div id="edit_field_status_10_field_status_und_select_chzn" class="chzn-container chzn-container-single" style="width: 100px;" title=""><a tabindex="-1" class="chzn-single" href="javascript:void(0)"><span>In</span></a>
    <div style="left: -9000px; width: 98px; top: 25px;" class="chzn-drop">
      <div class="chzn-search">
        <input type="text" autocomplete="off" style="width: 63px;">
      </div>
      <ul class="chzn-results">
        <li style="" class="active-result" id="edit_field_status_10_field_status_und_select_chzn_o_0">- select -</li>
        <li style="" class="active-result result-selected" id="edit_field_status_10_field_status_und_select_chzn_o_1">In</li>
        <li style="" class="active-result" id="edit_field_status_10_field_status_und_select_chzn_o_2">Gym</li>
        <li style="" class="active-result" id="edit_field_status_10_field_status_und_select_chzn_o_3">Lunch</li>
        <li style="" class="active-result" id="edit_field_status_10_field_status_und_select_chzn_o_4">Out</li>
        <li style="" class="active-result" id="edit_field_status_10_field_status_und_select_chzn_o_5">Other</li>
      </ul>
    </div>
  </div>
</div>
4

5 回答 5

8

这边走:

<input type="button" id="triggerAll">

<input type="button" class="button1">
<input type="button" class="button2">
<input type="button" class="button3">
$('#triggerAll').on('click',function(){
    $('.button1,.button2,.button3').trigger('click');
});

或者这样:

<input type="button" id="triggerAll">

<input type="button" class="processed">
<input type="button" class="processed">
<input type="button" class="processed">
$('#triggerAll').on('click',function(){
    $('.processed').trigger('click');
});

或者这样:

<form class="monitorChanges">
    <label>
        Pick one:
        <select data-defaultvalue="" name="other">
            <option value="" selected></option>
            <option value="1">One</option>
            <option value="2">Two</option>
            <option value="3">Three</option>
            <option value="4">Four</option>
        </select>
    </label>
    <label>
        Other:
        <input type="text" data-defaultvalue="" name="other">
    </label>
    <input type="submit">
</form>

<input type="text" value="Trigger All" id="triggerAll">
$('.monitorChanges').on('change keyup',"input,textarea,select",function(){
    var defaultValue = $(this).data('defaultvalue');

    if ($(this).val() !== defaultValue){
        $(this).parent().parent().find('input[type="submit"]:not(.processed)').addClass('processed');
    }
    else {
       $(this).parent().parent().find('input[type="submit"].processed').removeClass('processed');
    }
});

$('#triggerAll').on('click',function(){
    $(this).parent().find('form input[type="submit"].processed').trigger('click');
});
于 2013-04-10T13:20:29.533 回答
1
$('#mybtnId').click(function(){
    $('button, input[type=button]').not('#mybtnId').trigger('click');
});
于 2013-04-10T13:20:52.453 回答
0

我想出了一个对我有用的解决方案:

// Find input(s) that have changed. Add class to their hidden submit button.
$(function() {
    $("input, select").change(function() {
        $(this).closest('td').find('input.ajax-processed').addClass("changed");
    });
});

// One button to submit all input(s) that have changed.
$('.submit-all').click(function(){
    $('.changed, input[type=button]').not('.submit-all').trigger('click');
});

感谢大家的帮助。它结合了你所有的建议来让这头野兽工作,它也帮助我重新思考我想要完成的事情。

于 2013-04-11T15:40:34.143 回答
0

这对我有用,使用纯 JavaScript。我在包含两个 resetonclick的列表项 ( ) 上使用了该事件。它们控制不同的 ',其中一个不显示在列表项 ( ) 中。当然,您可以在任何类型的输入中进行相同的实现。libuttonformstyle="display:none;"

<ul>
  <li onclick="document.getElementById('btn-clear-1').click(); document.getElementById('btn-clear-2').click();">
    <input class="btn" id="btn-clear-1" form="frm1" type="reset" value="Clear" />
    <input class="btn" id="btn-clear-2" form="frm2" type="reset" value="Clear" style="display:none;" />
  </li>
</ul>

但是我所做的是我正在寻找的不必要的代码。它可能是<li onclick="document.getElementById('#frm1').reset(); document.getElementById('#frm2').reset();">Clear</li> (评论只是为了避免这个板上的错误编码)

于 2014-03-07T13:32:22.783 回答
0

这是一个特定于您的示例:

$('.processed').on('click', function (e) {
    //real event
    if (e.originalEvent !== undefined) {
        $('.processed').click();
    }
    //manually triggered event
    else {
           alert($(this).text() + ' triggered');
    }
});

希望这可以帮助!您可以在这个jsFiddle 示例中看到它的工作原理

于 2013-04-10T13:25:32.613 回答