2016-11-26 7 views
1

送信ボタンをクリックすると、htmlスライダを非表示にしてjqueryでボタンを送信しようとしています。残念ながら、私のコードは動作していないし、スライダーと送信ボタンは戻ってくる前に一時的に隠されています。私は本当に感謝し、助ける!HTMLスライダーが非表示にならない

<form> 
     <input id="bet" type="range" min="0" max="100" value="0" step="1" onchange="showValue(this.value)" /> 
     <input id="submit_bet" type="submit" value="Submit Bet!"/> 
    </form> 

    <span id="range">0</span> 

    <script type="text/javascript"> 
    function showValue(newValue) 
    { 
     document.getElementById("range").innerHTML=newValue; 
    } 
    </script> 

    <script type="text/javascript"> 
     $(document).ready(function(){ 
      $("#submit_bet").click(function() { 
       $("#bet").hide(); 
       $("#submit_bet").hide(); 
       $("range").hide(); 
      }); 
     }) 
    </script> 

答えて

1

スニペットあなたのデザイン...

クリックしたときにスライダーと送信ボタンを非表示にしたい場合は、試してみてください:

<input id="submit_bet" type="button" value="Submit Bet!"/> 

type="submit"ボタンを使用すると、フォームが送信され、ページが更新されます。

+0

ありがとうございました!!!これはそれを修正しました! –

1

あなたはこれを試すことができ、あなたはレンジスパン要素のIDを選択「#」を忘れていた、以下に含まれていますがたぶん私は理解して

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<meta charset="ISO-8859-1"> 
 
<title>Insert title here</title> 
 
</head> 
 
<body> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
 
     <input id="bet" type="range" min="0" max="100" value="0" step="1" onchange="showValue(this.value)" /> 
 
     <input id="submit_bet" type="submit" value="Submit Bet!"/> 
 
    </form> 
 

 
    <span id="range">0</span> 
 

 
    <script type="text/javascript"> 
 
    function showValue(newValue) 
 
    { 
 
     document.getElementById("range").innerHTML=newValue; 
 
    } 
 
    </script> 
 

 
    <script type="text/javascript"> 
 
     $(document).ready(function(){ 
 
      $("#submit_bet").click(function(event) { 
 
      \t event.preventDefault(); 
 
       $("#bet").hide(); 
 
       $("#submit_bet").hide(); 
 
       $("#range").hide(); 
 
      }); 
 
     }) 
 
    </script> 
 
</body> 
 
</html>

+0

助けてくれてありがとうございますが、これはまだ動作していません! –

+0

しかし、スニペットで私は戻ってくるスライダーが表示されませんか? – GraveyardQueen

+0

私と同じですが、コードをローカルで実行すると何らかの理由で動作しません。 –

関連する問題