2009-09-08 39 views
2
<form action="1.html"> 
    <input type="radio" id="check1" name="check" /> 
    <input type="radio" id="check2" name="check" /> 
</form> 

我想實現的是:當<radio >與jQuery檢查時如何更改<form >的「動作」?

當「CHECK2」被選中

,變「行動」的值改爲「2.HTML」當爲「check1」被選中

,變「行動」的價值回到「1.html」

回答

4

這應該照顧你的問題。

$(function(){ 
    $('#check1').click(function() { 
     $(this).parent().attr('action', '1.html'); 
    }); 

    $('#check2').click(function() { 
     $(this).parent().attr('action', '2.html'); 
    }); 
}); 
+0

雖然這不起作用,但如果您添加標籤。 – abergmeier 2012-11-21 18:02:44

0

下面應該工作:

$("#check1").click 
(
    function() 
    { 
    $("form").attr("action", "1.html"); 
    } 
); 

$("#check2").click 
(
    function() 
    { 
    $("form").attr("action", "2.html"); 
    } 
); 
2

雖然上面的答案是正確的,你要小心做這種事情。

例如,假設您單擊check2。它改變了行動。您提交表單,或轉到其他頁面。現在你點擊後退按鈕。

瀏覽器重新加載頁面*,將窗體的操作重置爲HTML中給出的值。但!瀏覽器記住在表單字段中設置的以前的值,因此check2仍然處於選中狀態,而無法獲得單擊事件:無線電的狀態與表單操作的狀態不匹配。

爲避免這樣的問題,您應該始終在頁面加載時掃描表單值並更新依賴於它們的任何內容。

一般而言,您應該嘗試讓一個動作與接收服務器端腳本決定要做什麼,而不是即時更改動作。這樣可以避免像上面這樣的錯誤,並且阻止非JS UA上的表單。

*:如果Firefox仍然在加載頁面DOM緩存中,它可能不會重新加載頁面。

0
$('[name="abc"][value="abc"]').click(function() { 

$(".test").attr("action", "http://localhost/test.php"); 

}); 


$('[name="def"][value="def"]').click(function() { 


$(".test").attr("action", "http://localhost/test1.php"); 


}); 



<form name="form" class="test" action="http://localhost/test.php"> 
<input type="radio" name="abc" value="abc" /> 
<input type="radio" name="def" value="def" /> 
</form> 
相關問題