2017-01-19 3 views
-1

私は、ユーザーが選択した環境設定に基づいてホテルの結果を表示しようとしています。例えば、ユーザがプリファレンスからプールを選択してサブミットキーを押すと、それぞれの結果を含む新しいウィンドウが表示されなければならない。htmlのドロップダウンリストとチェックボックスで選択したオプションに従って結果を表示するにはどうすればよいですか?

同じように、ユーザーがドロップダウンリストから場所を選択して[GO]ボタンを押すと、特定のWebページが表示されますが、応答しなくなります。

私のボタンの両方が私が望むウェブページに向いていません。私はJavaScriptで新しく、自分のロジックを試しましたが、うまくいきませんでした。

私のHTMLコードは次のとおりです。

<!DOCTYPE html> 
<html> 

    <head> 
    <div class="header"> 

<h1> Hello</h1> 
</div> 
     <link rel="stylesheet" href="style.css" type="text/css" /> 
     <script type="text/javascript"> 
     function is_checked() 
     { 
     var Pool= document.getElementById('Pool').checked; 
     var Gym= document.getElementById('Gym').checked; 
     var Beach= document.getElementById('Beach').checked; 
     if(Pool==false && Gym==false && Beach==false) 
      { 
      alert('Please check a category') 
      return false; 
      } 

     else if(Pool==true && Gym==false && Beach==false && WiFi==false && Spa==false) 
      { 
       window.open("http://http://localhost/dubai rev/codeReviews.php"); 
       return true; 
      } 
     } 

     function formaction(checkbox) 
     { 
     document.getElementById("myForm").action = checkbox.value; 
     } 




    function goToNewPage(dropdownlist) 
{ 
var url = dropdownlist.options(dropdownlist.selectedIndex).value; 
if (url != "") 
{ 
window.open(url); 
} 
} 
     </script> 
</head> 
    <body background="trip.jpg" style="background-image: 
    url(trip.jpg)"> 


<div class="menu"> 
<ul> 

<li><a href="/signup">SIGN-UP</a></li> 
<li><a href="/login">LOGIN</a></li> 
<li><a class="active" href="#n">HOME</a></li> 



</ul> 
</div> 

<ul> 

<div> 
<ul class="rig columns-3" id="content"align="left" > 
    <li> 

    <h1>STAY</h1> 
<form name="dropdown"> 
<select name="list" > 
<option selected>Select a place</option> 
<option value="http://search.msn.com/">Dubai</option> 
<option value="http://www.google.com/">London</option> 
<option value="http://www.search.com/">Lahore</option> 
<option value="http://www.dogpile.com/">New York</option> 
<option value="http://www.dogpile.com/">Canberra</option> 
</select> 
<input type=button value="Go" onclick="goToNewPage(document.dropdown.list)"> 
</form> 



    <br> 
    <p2>Preferences</p2> 
    <form action="demo_form.asp" method="get" onsubmit="return is_checked()"> 
    <input type="checkbox" name="hotel" value="Pool" id="pool"> Pool <br> 
    <input type="checkbox" name="hotel" value="Gym" checked="checked"> Gym <br> 
    <input type="checkbox" name="hotel" value="Beach" id="Beach"> Beach <br> 
    <input type="checkbox" name="hotel" value="WiFi" id="WiFi" checked="checked"> WiFi <br> 
    <input type="checkbox" name="hotel" value="Spa" id="Spa" checked="checked"> Spa<br> 

    <input type="submit" value="Submit"> 
    </li> 
    </body> 
    </html> 
+0

dropdownlist.options(dropdownlist.selectedIndex).value; dropdownlist.optionsにする必要があります[dropdownlist.selectedIndex] .value; – dev8080

+0

ありがとう!私のドロップダウンリストが動作し始めました:)もう一度ありがとう。 – MinjaNinja

+0

選択したチェックボックスに従ってウェブページを表示することについて私を案内してもらえますか? – MinjaNinja

答えて

1
dropdownlist.options(dropdownlist.selectedIndex).value; 

は、ウェブページの場合

dropdownlist.options[ dropdownlist.selectedIndex ].value; 

にする必要がありますが、これはあなたの実際のコードであると仮定すると...かなりの数のことをoverllokedています

var Pool= document.getElementById('Pool').checked; 

「プール」をHTMLで使用した場合は「プール」を使用しています

ここで、WiFiとスパを初期化しましたか?

また、ジムチェックボックスのIDはありません。

URLのスペースに%20を配置する必要があります。

これらすべてをお試しください。

+0

私はそれらを初期化し、HTMLの "プール"から "プール "でも同じページに残っています – MinjaNinja

+0

ジムのチェックボックスはありません。また、無線LANとスパの変数を初期化します – dev8080

+0

これは大きな助けになりました!ありがとうございます:) – MinjaNinja

1

http://http://localhost/dubai回転/ codeReviews.php

あなたがここにスペースを持っています。 URLは空白のない定数文字列である必要があります。必要な場合は、この文字を "%20"に変更してスペースをエンコードすることができます。

:)

+0

とダブルhttp ...も間違っています。 – dev8080

+0

私は%20を作りましたが、それでも私は再び同じホームページを表示しています:( – MinjaNinja

+0

@ dev8080それも修正しましたが、私は助けませんでした:( – MinjaNinja

関連する問題