2013-08-27 22 views
0

我試圖創建一個條件去進程的下一個階段。jQuery點擊if/else不工作

用戶需要在點擊「下一步」按鈕之前選擇「放棄」或「繼續」。

如果選擇其中一個,則點擊下一個按鈕進入下一頁。如果沒有,一個提示說:「你檢查了放棄還是繼續?」

這是我所看過的其他代碼,但它不適合我.jQuery沒有任何工作,甚至沒有alert = S Can誰能幫助我?

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Page</title> 
<link href="remote_style.css" rel="stylesheet" type="text/css"> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> 
</script> 
<script> 
$('#next').on('click', function() { 
    if ($('#abandon' || '#complete').attr('checked') === "checked") { 
     window.open('remote-user-testing5.html'); 
    } else { 
     alert("Have you checked Abandon or Complete?"); 
    } 
    return false; 
}); 
</script> 
</head> 

<body> 

<div> 
    <h1>Instruction window</h1> 
     <div class="text"> 
      <p>Now you will be asked to carry out 3 tasks and provide feedback on your experience.</p> 
      <p>To complete each task, you will need to navigate through a website.</p> 
      <p>Task complete: When you feel you have completed a task tick 'Complete' and click 'Next' in this Instruction Window.</p> 
      <p>Abandon task: If you are finding it difficult to complete a task, tick 'Abandon' and click 'Next' this Instruction Window.</p> 
      <p>Please remember we are not testing you, we are evaluating and testing the website.</p> 
      <p>When you are ready click 'Next' to find out your task scenario.</p> 
      <input type="radio" name="radio" value="abandon" id="abandon">Abandon<br> 
      <input type="radio" name="radio" value="complete" id="complete">Complete<br> 
      <button id="next">Next</button> 
     </div> 
</div> 

</body> 
</html> 
+0

@AmitAgrawal檢查「完成」並點擊下一步,你會看到它不起作用 – Anton

回答

2

腳本需要在DOM準備好了,你的選擇是INVA要運行蓋你必須使用獨立的人,並使用.is(":checked")

$(document).ready(function(){ 
    $('#next').on('click', function() { 
     if ($('#abandon').is(":checked") || $('#complete').is(':checked')) { 
      window.open('remote-user-testing5.html'); 
     } else { 
      alert("Have you checked Abandon or Complete?"); 
     } 
     return false; 
    }); 
}); 

您需要.ready功能彷彿DOM沒有完全準備好就不能看到的元素,以選擇它們。

.is檢查以查看所選擇的元件具有傳遞的參數,在這種情況下:checked測試checked屬性

+0

感謝您的詳細解答。 – user2706712

0

而不是if ($('#abandon' || '#complete').attr('checked') === "checked")

嘗試

if ($('#abandon').attr('checked') === "checked" || $('#complete').attr('checked') === 'checked') 
0

嘗試

$('#next').on('click', function() { 
    if ($('#abandon, #complete').is(':checked')) { 
     window.open('remote-user-testing5.html'); 
    } else { 
     alert("Have you checked Abandon or Complete?"); 
    } 
    return false; 
}); 
1

嘗試:

$(document).ready(function(){ 
    $('#next').on('click', function() { 
      if($('#abandon').is(':checked') || $('#complete').is(':checked')) { 
       window.open('remote-user-testing5.html'); 
      } else { 
       alert("Have you checked Abandon or Complete?"); 
      } 
      return false; 
    }); 
});