使用按鈕和收音機提交表單，但始終是相同的值？

<html> 
<body> 
    <h1> It is a minion with one eye or two eyes</h1> 

<div id="aside"> 
    <canvas id="mycanvas" width="600" height="500" style="border:1px solid #c3c3c3;"> 
    </canvas> 
<script> 
    var bodyStyle = document.body.style; 
    bodyStyle.mozUserSelect = 'none'; 
    bodyStyle.webkitUserSelect = 'none'; 


    var img = new Image(); 
    var canvas = document.querySelector('canvas'); 
     canvas.style.backgroundColor='transparent'; 
     canvas.style.position = 'absolute'; 
    var imgs = ['p_2.jpg','p_3.jpg','p_4.jpg','p_5.jpg','p_6.jpg','p_7.jpg','p_8.jpg','p_9.jpg','p_10.jpg','p_12.jpg' 
     ,'p_12.jpg','p_13.jpg','p_14.jpg','p_15.jpg','p_16.jpg','p_17.jpg','p_18.jpg','p_19.jpg','p_20.jpg','p_21.jpg','p_22.jpg', 
     'p_23.jpg','p_24.jpg','p_25.jpg','p_26.jpg']; 
    var num = Math.floor(Math.random()*24); 
    var effort=0; 

    img.src = imgs[num]; 

    img.addEventListener('load', function(e) { 
      var ctx; 
     // var w = img.width, 
     //  h = img.height; 
      var w=600; 
       h=500; 
      var offsetX = canvas.offsetLeft, 
       offsetY = canvas.offsetTop; 
      var mousedown = false; 

     function layer(ctx) { 
       ctx.fillStyle = 'gray'; 
       ctx.fillRect(0, 0, w, h); 
       } 

     function eventDown(e){ 
       e.preventDefault(); 
       mousedown=true; 
       } 
     function eventUp(e){ 
       e.preventDefault(); 
       mousedown=false; 
       var data=ctx.getImageData(0,0,w,h).data; 
       for(var i=0,j=0;i< data.length;i+=4){ 
        if(data[i] && data[i+1] && data[i+2] && data[i+3]){ 
        j++; 
        } 
       effort=1-j/(w*h); 
       } 
       if(j<=w*h*0.2){ 
        ctx.fillRect(0, 0, w, h); 
        alert('ok'); 
       } 

       }   

     function eventMove(e){ 
       e.preventDefault(); 
       if(mousedown) { 
       if(e.changedTouches){ 
        e=e.changedTouches[e.changedTouches.length-1]; 
       } 
       var x = (e.clientX + document.body.scrollLeft || e.pageX) - offsetX || 0, 
        y = (e.clientY + document.body.scrollTop || e.pageY) - offsetY || 0; 
      with(ctx) { 
       beginPath() 
      //arc(x, y, 10, 0, Math.PI * 2);//繪製圓點 
       rect(x,y,50,50); 
       fill(); 
      } 
      } 
     } 

     canvas.width=w; 
     canvas.height=h; 
     canvas.style.backgroundImage='url('+img.src+')'; 
     ctx=canvas.getContext('2d'); 
     ctx.fillStyle='transparent'; 
     ctx.fillRect(0, 0, w, h); 
     layer(ctx); 

     ctx.globalCompositeOperation = 'destination-out'; 

     canvas.addEventListener('touchstart', eventDown); 
     canvas.addEventListener('touchend', eventUp); 
     canvas.addEventListener('touchmove', eventMove); 
     canvas.addEventListener('mousedown', eventDown); 
     canvas.addEventListener('mouseup', eventUp); 
     canvas.addEventListener('mousemove', eventMove); 
    }); 

    </script>  



    </div> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"> </script> 

    <script type="text/javascript"> 
      $(document).ready(function(){ 
       $("#submit").click(function(){ 
         alert("already submit"); 
         var taskid=num; 
         var name=$("#name").val(); 
         var guessnum=$("#guessnum").val(); 

         $.ajax({ 
          type:"post", 
          url:"GameMysql.php", 
          data:"name="+name+"&taskid="+taskid+"&guessnum="+guessnum+"&effort="+effort, 

         success:function(data){ 
          $("#article").html(data); 

          } 

         }); 

       }); 
      }); 
    </script> 
    <div id="article" > 
     <form> 
      name : <input type="text" name="name" id="name"/> 
      </br> 

     <!-- guessNum: <input type="number" name="guessnum" id="guessnum"> --> 
      Select your guessNum: <br/ > 
     <input type="radio" name="guessnum" value="1" id="guessnum" /> 1 
      </br > 
     <input type="radio" name="guessnum" value="2" id="guessnum" /> 2 
      </br > 
     <input type="radio" name="guessnum" value="3" id="guessnum" /> 3 
     </br > 
     <input type="radio" name="guessnum" value="4" id="guessnum" /> 4 
     <br /> 
     <input type="button" value="Send Guess" id="submit"> 

    <!-- <input type="submit" value="Continue the Game" action="http://localhost.game5.php"> --> 
</form>

1我使用按鈕和無線電提交表單，並通過AJAX ID（#guessnum）讀取guessNum數據，但它總是收到1不管客戶提出什麼，不知道爲什麼？

2如果我想在ajax的成功函數裏添加一個url鏈接，我該怎麼做？謝謝。

來源

2015-04-04 rockmerockme

id s應該是唯一的，但是您使用的是4個元素的guessnum。您可以刪除id S和上名來選擇，而不是：

$("input[name=guessnum]").val();

不過，這不會給你正確的答案，因爲它總是給你第一輸入這個名字的價值 - 不管它是否被選中。

而是執行此操作：

$("input[name=guessnum]:checked").val();

例子：

$('button').click(function() { 
 
    alert($("input[name=guessnum]:checked").val()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="radio" name="guessnum" value="1" id="guessnum" /> 1 <br> 
 
<input type="radio" name="guessnum" value="2" id="guessnum" /> 2 <br> 
 
<input type="radio" name="guessnum" value="3" id="guessnum" /> 3 <br> 
 
<input type="radio" name="guessnum" value="4" id="guessnum" /> 4 
 
<br> 
 
<button id="b1">Show value</button>

來源

2015-04-04 12:54:30

您正在使用相同的id guessnum針對不應該做的多個元素。並獲得選定單選按鈕的值：

$('input[name="genderS"]:checked').val();

來源

2015-04-04 12:54:40 Ramsharan

使用按鈕和收音機提交表單，但始終是相同的值？

回答

相關問題