的jQuery提交阿賈克斯表格2提交按鈕

我嘗試實現以下，在PHP我有一個這樣的形式：的jQuery提交阿賈克斯表格2提交按鈕

<form method="post" id="form_1" action="php.php"> 
<input type="submit" value="add" name="sub"/> 
<input type="submit" value="envoi" name="sub"/> 
</form>

形式操作文件是：

<?php 

if($_POST["sub"]=="add"){ ?> 

<script> 
alert("") 
</script> 
<?php echo "ZZZZZZ"; ?> 

<?php } ?>

因此，這意味着如果我按價值添加一個警報提示將出現，我怎麼能做同樣的事情（區分既提交），但使用Ajax請求：

以下代碼，所以不起作用：

$(function(){ 
     $('form#form_1').submit(function(){ 
var _data= $(this).serialize() 
$.ajax({ 
     type: 'POST', 
     url: "php.php?", 
     data:_data, 
     success: function(html){ 
     $('div#1').html(html) 

      } 
    }) 
}) 
    }) 
    </script> 
</head> 

<body> 
<div id="1" style="width: 100px;height: 100px;border: 1px solid red"></div> 

<form method="post" id="form_1" action="javascript:;"> 
<input type="submit" value="add" name="sub"/> 
<input type="submit" value="envoi" name="sub"/> 
</form> 
</body>

來源

2010-07-18 tetris

您在javascript中缺少分號（';'）。 – tcooc 2010-07-18 13:23:26

分號不是強制性的，這不是問題。 – tetris 2010-07-18 13:25:27

它正在做什麼，是你唯一的問題，它仍然在做一個完整的回發？ – 2010-07-18 13:26:55

您可以將事件處理程序放在按鈕上而不是窗體上。從窗體中獲取參數，然後爲該按鈕添加一個參數，併發布窗體。確保處理程序返回「false」。

$(function() { 
    $('input[name=sub]').click(function(){ 
    var _data= $('#form_1').serialize() + '&sub=' + $(this).val(); 
    $.ajax({ 
     type: 'POST', 
     url: "php.php?", 
     data:_data, 
     success: function(html){ 
     $('div#1').html(html); 
     } 
    }); 
    return false; 
    }); 
});

您必須明確添加「sub」參數，因爲當您調用「serialize（）」時，jQuery不包括那些參數。

來源

2010-07-18 13:27:47 Pointy

很多分號丟失的，請參閱下面

$(function(){ 
     $('form#form_1').submit(function(){ 
     var _data= $(this).serialize(); 
     $.ajax({ 
      type: 'POST', 
      url: "php.php?", 
      data:_data, 
      success: function(html){ 
       $('div#1').html(html);  
      } 
     }); 
     }); 
    });

來源

2010-07-18 13:28:06 Starx

上帝，我想把-1作爲你的答案。現在可以回到0. – tetris 2010-07-18 14:10:19

這可能不是你的答案，但它是一個很好的標準，爲什麼不把你的-1 – Starx 2010-07-18 15:32:50

在這種情況下，你需要手動添加提交按鈕來發布數據，這樣的：

$(function(){ 
    $('form#form_1 :submit').submit(function(){ 
    var _data = $(this).closest('form').serializeArray(); //serialize form 
    _data.push({ name : this.name, value: this.value }); //add this name/value 
    _data = $.param(_data);        //convert to string 
    $.ajax({ 
     type: 'POST', 
     url: "php.php?", 
     data: _data, 
     success: function(html){ 
     $('div#1').html(html); 
     } 
    }); 
    return false; //prevent default submit 
    }); 
});

我們使用.serializeArray()到獲取表格的序列化版本（which is what .serialize() uses internally），在之前將我們的名稱/值對添加到，然後通過$.param()將其序列化爲字符串。

最後加入的是return false以防止默認提交會離開頁面的行爲。

來源

2010-07-18 13:32:09

jQuery Form plugin jQuery Form plugin提供了一些先進的功能，它已自動執行一些我們必須手動完成的任務，請看看它。它還提供了處理表單元素，序列化的更好方法，您可以在提交表單之前插入預處理函數。

來源

2010-07-18 14:08:45

的jQuery提交阿賈克斯表格2提交按鈕

回答

相關問題