Question

我有当前的表单设置

<form name="form" id="form">

<div class="controls">
<table border="0">
<thead>
<tr>
<th>Relay ID</th>
<th colspan="3">Gate Action</th>
<th colspan="3">Scanner Action</th>
<th colspan="2">RESET</th>
</tr>
</thead>

<tbody>
<tr>
<td class="relay-id"><?php print relay_enum('gid'); ?></td>
<td><button class="btn" id="g10" name="g10" value="10">Query Gate</button></td>
<td><button class="btn" id="g1" name="g1" value="1">Flip Gate 1</button></td>
<td><button class="btn" id="g2" name="g2" value="2">Flip Gate 2</button></td>

<td><button class="btn" id="g3" name="g3" value="3">Query Scanners</button></td>
<td><button class="btn" id="g4" name="g4" value="4">Reset Scanner 1</button></td>
<td><button class="btn" id="g5" name="g5" value="5">Reset Scanner 2</button></td>

<td><button class="btn" id="g6" name="g6" value="6">RESET ALL GATE</button></td>
<td><button class="btn" id="g7" name="g7" value="7">RESET ALL SCANNER</button></td>
</tr>
</tbody>


</table>

<div class="bottom">
<button class="btn" id="reboot" name="g8" value="8" class="danger">REBOOT</button>
<button class="btn" id="powerdown" name="g9" value="9" class="danger">POWERDOWN</button>
</div>

</div>

以及处理它的jquery脚本。

$(document).ready(function() {

      $('.btn,#reboot,#powerdown').click(function (e){

        e.preventDefault();

        $btnval = $(this).attr('value');

        $.ajax({
        type: 'POST',
        url: 'post.php',
            data: { btnname : $btnval },
            dataType:'html',
            success: function(d){
        $("#output").prepend(d);
        console.log(html);
        }               
    });
  });

 });

上面的脚本已经有效，但是每当按下#reboot和#powerdown时我都会尝试设置确认按钮。我不知道在哪里放下以下代码：

$("#reboot, #poweroff").click(function (e) {

        if( !confirm('Are you sure you want to continue?')) {
             return false;
        }

});

这个想法是，当按下任何.btn按钮时，如果按钮是#reboot或#powerdown，请求确认。如果点击“确定”或“确定”，请继续发布。

我该怎么做？

Answer 1

尝试以下代码。

 $(document).ready(function() {

  $('.btn,#reboot,#powerdown').click(function (e){

    e.preventDefault();

    $btnval = $(this).attr('value');
    if($(this).attr('id') === 'reboot' || $(this).attr('id') === 'powerdown'){

        if( !confirm('Are you sure you want to continue?')) {
            return false;
        }else{     
           $.ajax({
           type: 'POST',
           url: 'post.php',
           data: { btnname : $btnval },
           dataType:'html',
           success: function(d){
              $("#output").prepend(d);
              console.log(html);
           } 
          });
        }
     }           
  });
});

Answer 2

您不必将点击事件绑定到具有特定id的按钮，因为您的所有按钮都附加了点击事件 - .btn。您可以点击查看中当前点击的按钮的id属性。

试试这个：

// attach click event to elements with .btn class: $('.btn').click(function (e){ e.preventDefault(); // get the id of pressed button: var id = $(this).attr('id'); // if the id match 'reboot' or 'powerdown' ask for confirmation: if((id == 'reboot' || id == 'powerdown') && !confirm('Are you sure you want to continue?')) { // not confirmed, stop executing the function: return false; } // if confirmed, or the button id is different than 'reboot' or 'powerdown', continue function and run ajax: $btnval = $(this).attr('value'); $.ajax({ // ... your AJAX ... }); });

有条件的AJAX提交

2 个答案: