Wie kann ich die ausgewählten Werte in den Dropdown-Listen von einer HTML-Seite auf eine neue Seite anzeigen/umleiten? Wenn ich zum Beispiel einen Wert aus der Dropdown-Liste auswähle und wenn ich auf die Schaltfläche "GO" klicke, wird die Seite auf eine neue Seite mit dem ausgewählten Wert geleitet. Brauche Hilfe zu diesem Thema.HTML - So zeigen Sie ausgewählte Werte aus dem Dropdown-Menü an und verweisen sie auf eine neue HTML-Seite

<!DOCTYPE html> 
 
<html> 
 

 
<body> 
 
    <div align="center"> 
 

 
    <center> 
 
     <h4 style="color:darkblue">Choose Your Food/Beverage & Status : </h3> 
 
    </center> 
 

 
    <table> 
 
     <tr> 
 
     <td> 
 

 
      <font size=2> 
 
      <B>Choose a Food/Beverage : </B> 
 
      </font> 
 

 
      <select ID="foodbeverage"> 
 
\t 
 
\t <optgroup label="DEFAULT"> 
 
\t <option value = "NONE">NONE</option> 
 
\t </optgroup> 
 
\t 
 
\t <optgroup label="Food"> 
 
\t <option value = "chickenchop">Chicken Chop</option> 
 
\t <option value = "pasta">Pasta</option> 
 
\t <option value = "pizza">Pizza</option> 
 
\t <option value = "chocolate">Chocolate Cake</option> 
 
\t <option value = "redvelvet">Red Velvet Cake</option> 
 
\t <option value = "icecream">Ice Cream Cake</option> 
 
\t </optgroup> 
 
\t 
 
\t <optgroup label="Beverages"> 
 
\t <option value = "milk">Milk</option> 
 
\t <option value = "freshjuice">Fresh Juice</option> 
 
\t <option value = "icecream">Ice Cream</option> 
 
\t <option value = "coffee">Coffee</option> 
 
\t <option value = "carbonated">Carbonated Can Drink</option> 
 
\t <option value = "water">Water</option> 
 
\t </optgroup> 
 
\t 
 
\t </select> 
 
      <br/> 
 

 
      <font size=2> 
 
      <B>Choose a Food/Beverage : </B> 
 
      </font> 
 

 
      <select ID="foodbeverage"> 
 
\t 
 
\t <optgroup label="DEFAULT"> 
 
\t <option value = "NONE">NONE</option> 
 
\t </optgroup> 
 
\t 
 
\t <optgroup label="Food"> 
 
\t <option value = "chickenchop">Chicken Chop</option> 
 
\t <option value = "pasta">Pasta</option> 
 
\t <option value = "pizza">Pizza</option> 
 
\t <option value = "chocolate">Chocolate Cake</option> 
 
\t <option value = "redvelvet">Red Velvet Cake</option> 
 
\t <option value = "icecream">Ice Cream Cake</option> 
 
\t </optgroup> 
 
\t 
 
\t <optgroup label="Beverages"> 
 
\t <option value = "milk">Milk</option> 
 
\t <option value = "freshjuice">Fresh Juice</option> 
 
\t <option value = "icecream">Ice Cream</option> 
 
\t <option value = "coffee">Coffee</option> 
 
\t <option value = "carbonated">Carbonated Can Drink</option> 
 
\t <option value = "water">Water</option> 
 
\t </optgroup> 
 
\t 
 
\t </select> 
 
      <br/> 
 

 
     </td> 
 

 
     <td> 
 
      <font size=2> 
 
      <B>Dine In or Take Away : </B> 
 
      </font> 
 
      <select ID="status"> 
 
\t 
 
\t <optgroup label="DEFAULT"> 
 
\t <option value = "NONE">NONE</option> 
 
\t </optgroup> 
 
\t 
 
\t <optgroup label="STATUS"> 
 
\t <option value = "dinein">Dine In</option> 
 
\t <option value = "takeaway">Take Away</option> 
 
\t </optgroup> 
 
\t </select> 
 
      <br/> 
 

 
      <font size=2> 
 
      <B>Dine In or Take Away : </B> 
 
      </font> 
 
      <select ID="status"> 
 
\t 
 
\t <optgroup label="DEFAULT"> 
 
\t <option value = "NONE">NONE</option> 
 
\t </optgroup> 
 
\t 
 
\t <optgroup label="STATUS"> 
 
\t <option value = "dinein">Dine In</option> 
 
\t <option value = "takeaway">Take Away</option> 
 
\t </optgroup> 
 
\t </select> 
 
      <br/> 
 

 
     </td> 
 
     </tr> 
 
    </table> 
 

 
    <br/> 
 
    <form method="get" action="newPage.html"> 
 
     <input type="submit" value=" GO " /> 
 
    </form> 
 
    <br/> 
 

 
</body> 
 

 
</html>

Auf dieser Seite möchte ich die Werte entsprechend angezeigt/umgeleitet werden.

<!DOCTYPE html> 
 
<html> 
 

 
<body> 
 
    <div align="center"> 
 

 
    <font size=4> 
 
     <B>Food/Beverage Selected : </B> 
 
    </font> 
 

 
    <br/> 
 
    <br/> 
 

 
    <font size=4> 
 
     <B>Dine In/Take Away : </B> 
 
    </font> 
 

 
    <br/> 
 
    <br/> 
 

 
</body> 
 

 
</html>

Quelle

2017-08-25 cerberus99

Die Erklärung

Der einfachste Weg, meiner Meinung nach ist ein Formular und PHP-Code zu verwenden, um die andere Seite zu füllen. Um Daten von einer Seite an eine andere zu übergeben, haben Sie ein Formular verwendet. Aber Sie müssen Ihre Auswahl in das Formular einfügen.

Und dann, um die Daten auf der zweiten Seite anzuzeigen, benötigen Sie etwas PHP-Code. Sie müssen also Ihre newPage.html in newPage.php umbenennen.

Run PHP

Dann natürlich die PHP laufen Sie einen Server benötigen. Wenn Sie keine haben, empfehle ich Ihnen installieren entweder einer von ihnen:

WAMp für Fenster
MAMP für Mac
XAMP für Linux (auch auf Fenster und Mac.

Der Code

<!DOCTYPE html> 
 
<html> 
 

 
<body> 
 
<div align="center"> 
 

 
    <center> 
 
     <h4 style="color:darkblue">Choose Your Food/Beverage & Status : </h3> 
 
    </center> 
 

 
    <form method="get" action="newPage.php"> 
 
     <div> 
 
      <label for='foodbeverage'>Choose a Food/Beverage : </label> 
 

 
      <select ID="foodbeverage" name='foodbeverage[]'> 
 
       <optgroup label="DEFAULT"> 
 
        <option value="NONE">NONE</option> 
 
       </optgroup> 
 
       <optgroup label="Food"> 
 
        <option value="chickenchop">Chicken Chop</option> 
 
        <option value="pasta">Pasta</option> 
 
        <option value="pizza">Pizza</option> 
 
        <option value="chocolate">Chocolate Cake</option> 
 
        <option value="redvelvet">Red Velvet Cake</option> 
 
        <option value="icecream">Ice Cream Cake</option> 
 
       </optgroup> 
 
       <optgroup label="Beverages"> 
 
        <option value="milk">Milk</option> 
 
        <option value="freshjuice">Fresh Juice</option> 
 
        <option value="icecream">Ice Cream</option> 
 
        <option value="coffee">Coffee</option> 
 
        <option value="carbonated">Carbonated Can Drink</option> 
 
        <option value="water">Water</option> 
 
       </optgroup> 
 
      </select> 
 

 
      <label for='status'> 
 
       Dine In or Take Away : 
 
      </label> 
 
      <select ID="status" name='status[]'> 
 

 
       <optgroup label="DEFAULT"> 
 
        <option value="NONE">NONE</option> 
 
       </optgroup> 
 

 
       <optgroup label="STATUS"> 
 
        <option value="dinein">Dine In</option> 
 
        <option value="takeaway">Take Away</option> 
 
       </optgroup> 
 
      </select> 
 

 
     </div> 
 
     <br/> 
 

 
     <div> 
 
      <label for='foodbeverage2'>Choose a Food/Beverage : </label> 
 

 
      <select ID="foodbeverage2" name='foodbeverage[]'> 
 
       <optgroup label="DEFAULT"> 
 
        <option value="NONE">NONE</option> 
 
       </optgroup> 
 
       <optgroup label="Food"> 
 
        <option value="chickenchop">Chicken Chop</option> 
 
        <option value="pasta">Pasta</option> 
 
        <option value="pizza">Pizza</option> 
 
        <option value="chocolate">Chocolate Cake</option> 
 
        <option value="redvelvet">Red Velvet Cake</option> 
 
        <option value="icecream">Ice Cream Cake</option> 
 
       </optgroup> 
 
       <optgroup label="Beverages"> 
 
        <option value="milk">Milk</option> 
 
        <option value="freshjuice">Fresh Juice</option> 
 
        <option value="icecream">Ice Cream</option> 
 
        <option value="coffee">Coffee</option> 
 
        <option value="carbonated">Carbonated Can Drink</option> 
 
        <option value="water">Water</option> 
 
       </optgroup> 
 
      </select> 
 

 
      <label for='status2'> 
 
       Dine In or Take Away : 
 
      </label> 
 
      <select ID="status2" name="status[]"> 
 

 
       <optgroup label="DEFAULT"> 
 
        <option value="NONE">NONE</option> 
 
       </optgroup> 
 

 
       <optgroup label="STATUS"> 
 
        <option value="dinein">Dine In</option> 
 
        <option value="takeaway">Take Away</option> 
 
       </optgroup> 
 
      </select> 
 

 
     </div> 
 

 

 
     <br/> 
 
     <input type="submit" value=" GO "/> 
 
    </form> 
 

 
</div> 
 

 
</body> 
 

 
</html>

Und es ist Ihre newPage.php Datei.

<!DOCTYPE html> 
<html> 

<body> 
<div align="center"> 

    <? 
    for ($i = 0; $i < sizeof($_GET['foodbeverage']); $i++) { 
     echo '<span style="font-size: medium; "><B>Food/Beverage Selected : ' 
      . $_GET['foodbeverage'][$i] 
      . '</B></span>' 
      . '<br/><br/>' 
      . '<span style="font-size: medium; "><B>Dine In/Take Away : ' 
      . $_GET['status'][$i] 
      . '></B></span><br/><br/>'; 
    } 
    ?> 

</div> 

</body> 

</html>

Hoffe, dass hilft.

EDIT:

Natürlich sind Sie nicht zwingen, PHP für die Server-Seite zu verwenden. Wenn Sie eine andere Sprache verwenden, ist es auch in Ordnung.

Quelle

2017-08-25 09:49:31

-1

Try Code unten: Geben Sie unterschiedliche IDs zu verschiedenen Aufklappmenü. Ich schreibe Code für zwei Dropdown-Listen

<input type="submit" id="btngo" value="Go" /> 
<script type="text/javascript"> 
    $(function() { 
     $("#btngo").bind("click", function() { 
      var url = "Page2.htm?foodbeverage=" + encodeURIComponent($("#foodbeverage").val()) + "&status=" + encodeURIComponent($("#status").val()); 
      window.location.href = url; 
     }); 
    }); 
</script>

In der zweiten Seite: geben ID div sagen showdata: <div id="showdata" align="center">

<script type="text/javascript"> 
    var queryString = new Array(); 
    $(function() {   
     if (queryString["foodbeverage"] != null && queryString["status"] != null) {     
      var data = "<b>Food Beverages:</b> " + queryString["foodbeverage"] + " <b>Dine Takeaway:</b> " + queryString["status"]; 
      $("#showdata").html(data); 
     } 
    }); 
</script>

You can vist this for more information Es gibt vier verschiedene Wege, dies zu tun.

Wenn Sie nicht wollen, verwenden jquery dann localStorage versuchen Sie es mit:

localStorage["key"] = value; 

... in another page ... 
value = localStorage["key"];

Besuch this page. Es hat nur eine Lösung für Javascript.

Hoffe es wird dir helfen .. !!

Quelle

2017-08-25 02:31:41 Preet

Die erste Seite kann nicht auf die zweite Seite umleiten :( – cerberus99

Es sollte funktionieren. Plz überprüfen Sie Ihren Code. Plz Siehe meine aktualisierte Antwort. Ich denke, Sie brauchen jquery-Bibliothek dafür. Danke – Preet

Wenn Sie nicht jquery verwenden möchten dann habe ich eine lösung dafür ich bin mir nicht sicher, ob es funktioniert sehe meine aktualisierte antwort – Preet

HTML - So zeigen Sie ausgewählte Werte aus dem Dropdown-Menü an und verweisen sie auf eine neue HTML-Seite

Antwort

Die Erklärung

Der Code

Verwandte Themen