修改表單，以便頁面在提交時不刷新

我有一個簡單的表單，通過該表單可以在單擊某個按鈕時爲輸入字段賦予一個值。問題是需要很長時間才能重新加載頁面，我想在不刷新頁面的情況下提交它。我曾嘗試過修改某些AJAX，來自不同類型的JQuery腳本，但他們沒有工作，任何人都可以提供一些簡單的代碼來使用。這裏是基本的例子：修改表單，以便頁面在提交時不刷新

<html> 
<form method='POST' action='test2.php'> 
<input type='text' name='input_a' value='<?php if($_POST['submit_a']) 
{ 
    echo "test1"; 
} ?>'> 

<input type='submit' name='submit_a' value='a'> 
<input type='text' name='input_b' value='<?php if($_POST['submit_b']) 
{ 
    echo "test2"; 
}?>'> 

<input type='submit' name='submit_b' value='b'> 
</form> 
</html>

來源

2012-10-06 user1557515

什麼用完全AJAX腳本的問題？ – ultranaut

我不認爲我正確調整了代碼。 – user1557515

-1

我改編這隻使用香草javascript，如果用例真的是這個基本。如果需要訪問服務器端，此解決方案將無濟於事，您將不得不更多地瞭解Ajax的工作原理。

HTML：

<html> 
<form> 
    <input type='text' name='input_a' id="input_a"/><input type='submit' name='submit_a' value="a" onclick="setInput(this, 'test1'); return false;"> 
    <input type='text' name='input_b' id="input_b"/><input type='submit' name='submit_b' value="b" onclick="setInput(this, 'test2'); return false;"> 
</form> 
</html>

的Javascript：

function setInput(button, setValue) { 
    var buttonVal = button.value, 
     textbox = document.getElementById('input_' + buttonVal); 

    textbox.value = setValue; 
}

這裏是的jsfiddle工作的例子： http://jsfiddle.net/6jpNf/1/

來源

2012-10-06 00:42:04

看起來不錯，非常感謝，我現在就試試看。 :) – user1557515

是的，它工作完美，很好，簡潔。輝煌！ – user1557515

這是一個使用AJAX張貼的例子（你必須調整你的響應代碼）。我假設你需要發佈，因爲你概述的場景可以很容易地完全用JavaScript來完成。

$(function(){ 
    $('input[type="submit"]').click(function(){ 
     var form = $(this).parents('form'); 
     var postData = form.serialize(); 
     postData[$(this).attr('name')] = $(this).val(); // the value for the click won't be retrieved with serialize 
     $.post(form.attr('action'), postData , function(data) { 
      $('body').html(data); 
     }); 
     return false; 
    }); 
};

如果你能做到這一點而不發佈，它會是這樣的：

$(function(){ 
    $('input[name="submit_a"]').click(function(){ 
     $('input[name="input_a"]').val('test1'); 
    }); 
    $('input[name="submit_b"]').click(function(){ 
     $('input[name="input_b"]').val('test2'); 
    }); 
});

來源

2012-10-06 00:43:13 smdrager

謝謝你的代碼。非常感激。 – user1557515

修改表單，以便頁面在提交時不刷新

回答

相關問題