我想補充的HTML選擇框4個不同的條件

這裏是我的html代碼：我想補充的HTML選擇框4個不同的條件

<select name="field"> 
    <option value="Camera">Camera</option> 
    <option value="Clothing">Clothing</option> 
    <option value="Coins">Coins</option> 
    <option value="Mobile">Mobiles</option> 
</select>

現在我想「如果我選擇相機的話，我會重定向到另一個頁面可能camera.html頁面同樣如果我選擇衣服，那麼我會重定向到另一頁可能是clothing.html頁面以同樣的方式爲其他2個選項，以及我想要相同的功能

如果生病使用這4個不同的鏈接使用標籤，但我想這樣做使用表單的提交按鈕我想用選擇框和on-submit調用，而不是4個不同的鏈接做這件事..

所以我非常需要關於這方面的幫助..請幫我解釋一下這段代碼，這樣我就能理解我該如何實現這個了？

來源

2013-07-16 John Smith

用HTML你不能，但你可以用JavaScript。你能夠在你的項目中使用JavaScript嗎？ –

下拉菜單可能會實現比本地表單字段更好的功能。 –

您可以將'value'屬性設置爲指向您想要轉到的URL /網頁，然後使用JavaScript（或jQuery）重定向用戶。

E.g.

<html> 
    <head> 
     <script type="text/javascript"> 

     function redirect() { 

      var myUrl = document.getElementById("selectBox").value; 
      window.location.href = myUrl; 

      return false; 

     } 

     </script> 
    </head> 
    <body> 
     <form onSubmit="return redirect()"> 
     <select id="selectBox" name="field"> 
      <option value="Camera.html">Camera</option> 
      <option value="Clothing.html">Clothing</option> 
      <option value="Coins.html">Coins</option> 
      <option value="Mobile.html">Mobiles</option> 
     </select> 
     <input type="submit" /> 
     </form> 
    </body> 
</html>

編輯：我已經更新了我的代碼使用的onsubmit（）爲你問。

來源

2013-07-16 19:15:15

它是否適用於窗體的onSubmit按鈕調用???就像我在提交按鈕中稱之爲onSubmit =「redirect（）」 –

非常感謝你對我的代碼所做的一切 –

你能幫我解答嗎？ http://stackoverflow.com/questions/17686196/i-want-to-save-the-data-from-text-fields-and-select-boxes-of-html-and-want-to-pa –

我想補充一個JavaScript處理程序是這樣的：

<select onchange="location.href=this.value+'.html'">

如果你想用一個提交按鈕，你需要添加一些代碼來做到這一點：

<form onsubmit="location.href=this.form.target.value; return false;"> 
    <select name="target">...</select> 
    <input type="submit" /> 
    ...

來源

2013-07-16 19:15:38 rekire

我可以使用Javascript，如果有人可以教我一點，我該如何使用Javascript來做到這一點。我希望使用表單的提交按鈕完成此操作。我想用選擇框做這件事。提交它將檢查相機是否已被選中，然後它將進入其頁面和其他類似的..我不想使用任何下拉菜單。由於我在這種形式的選擇框中還有其他文本字段 –

請參閱我的更新（對於延遲，我使用移動設備表示歉意） – rekire

我沒有正確地獲取代碼，我應該在哪裏添加4個鏈接以獲得所有4個選項？ –

如果我理解你的問題正確地說，你希望選擇的項目是鏈接。如果這確實是你所要求的那麼簡單

<option><a href=`yoursite.html`>something</a></option>

應工作

來源

2013-07-16 19:17:43

沒有我不問我想要如果選擇任何選擇形式選擇框然後有一個提交按鈕的形式，所以當任何人點擊提交按鈕，它會去那個特定的頁面取決於選擇選項中選擇方塊 –

如果你不想依賴於JavaScript這一點，才使形式通過GET傳遞數據。這樣，您就可以訪問.htaccess中的選定選項。通過的RewriteCond，你可以重寫行動所需的頁面：

<form method="get" action="nonexistent.html"> 
    <select name="gotofile"> 
     <option value="camera">Camera</option> 
     <option value="clothing">Clothing</option> 
     <option value="coins">Coins</option> 
     <option value="mobile">Mobiles</option> 
    </select> 
</form>

在.htaccess-文件：

RewriteEngine On 
RewriteCond %{QUERY_STRING} ^gotofile=([^&]+) [NC,OR] 
RewriteCond %{QUERY_STRING} &gotofile=([^&]+) [NC] 
RewriteRule ^nonexistens\.html$ %1.html

來源

2013-07-16 19:26:12

好戲我喜歡。 – rekire

真的很好，易於使用jQuery來做到這一點。 jQuery庫位於http://jquery.com/download/下載。

我建議添加頁面的名稱作爲vales或命名您的頁面，以便將值包含在頁面的名稱中（即，如果頁面名稱是cameraPage.html，則相機選項的值爲「 cameraPage 「或」cameraPage.html。下面的例子將使用cameraPage，但你可以改變它是如何請你）。

$("formName").submit(function(){ 
    window.location.href = $('option:selected').val()+".html"; 
});

的$（「窗體名稱」）選擇選擇您的形式和.submit（函數（）意味着您現在正在提交表單時正在執行的功能。

「window.location。HREF =」重定向用戶到=後什麼都談到

$（ '選項：選擇'）。。VAL（）獲取所選選項的值

希望這有助於

來源

2013-07-16 20:01:16

你也可以使用PHP和javscript重定向做到這一點
這裏是窗體的HTML：

<form action="yourscript.php" method="post"> 
    <select name="field"> 
     <option value="Camera">Camera</option> 
     <option value="Clothing">Clothing</option> 
     <option value="Coins">Coins</option> 
     <option value="Mobile">Mobiles</option> 
    </select> 
    <input type="submit" value="Submit"> 
</form>

這裏是在yourscript.php的PHP：

<?PHP 
$field = $_POST['field']; 
if ($field == "Camera"){ 
    ?> 
    <script type="text/javascript"> 
    window.location.href='cameras.php'; 
    </script> 
    <?PHP 
} 
else if ($field == "Clothing"){ 
    ?> 
    <script type="text/javascript"> 
    window.location.href='clothing.php'; 
    </script> 
    <?PHP 
} 
else if ($field == "Coins"){ 
    ?> 
    <script type="text/javascript"> 
    window.location.href='coins.php'; 
    </script> 
    <?PHP 
} 
else if ($field == "Mobile"){ 
    ?> 
    <script type="text/javascript"> 
    window.location.href='mobile.php'; 
    </script> 
    <?PHP 
} 
?>

來源

2013-07-16 21:21:40

我想補充的HTML選擇框4個不同的條件

回答

相關問題