[英]PHP/HTML form and Javascript confirm box
我已經使用LimeSurvey
工具創建了一個調查。 對於某些自定義,我必須實現以下任務。
屏幕截圖:
在這里,當用戶單擊下一步時 ,如果未回答任何問題,我想通知用戶他們錯過了回答。
因此,當他們單擊Next時 ,我想看到一個確認框(Javascript),其中顯示一條消息,提示您錯過了。 分別是“可以,進入下一頁”按鈕和“我會留在這里回答”按鈕。
“可以,轉到下一頁”按鈕應具有與“下一步”按鈕相同的功能。
“我將留在這里並回答”按鈕將使用戶停留在同一頁面上。
我知道可以使用Javascript,但不確定如何執行此特定任務。
我只知道“下一步”按鈕的ID是“ movenextbtn”。
但是,當我單擊“下一步”按鈕並使用確認框時,我將如何檢查是否未回答問題,我將如何進入下一頁或停留在同一頁面。
任何幫助將不勝感激。
提前致謝。
這段代碼假定您只對表單中具有id為movenextbtn
的按鈕的單選按鈕感興趣。 您必須將其插入頁面的某個位置。
<script>
// wait for everything to load
window.addEventListener('load', function() {
// let's check radio buttons when the next button is clicked
var nextButton = document.getElementById('movenextbtn');
var form = nextButton.form;
nextButton.addEventListener('click', function(e) {
var radioElements = form.querySelectorAll('input[type="radio"]');
var currentRadioName;
var seenRadioName;
var index;
var confirmation;
for(index = 0; index < radioElements.length; index += 1) {
currentRadioName = radioElements[index].name;
// check if we've already seen this named radio button set
if(seenRadioName != currentRadioName) {
// check that there's a checked radio button for this set of named radio buttons
if(!form.querySelectorAll('input[type="radio"][name="' + currentRadioName + '"]:checked').length) {
// didn't answer a question, ask if that's ok
confirmation = confirm("You have missed answering a question.\n\nOK to Continue?\nCancel form submission and answer?");
if(confirmation) {
// the user clicked ok, let's submit the form
return true;
}
else {
// the user clicked cancel, let's stop the form submission
e.preventDefault();
e.stopPropagation();
return false;
}
}
// remember that we already checked this set of radio buttons
seenRadioName = currentRadioName;
}
}
}, false);
}, false);
</script>
您可以在此處進行更多操作: http : //jsbin.com/howuzapi/1/edit
將此腳本放在數組問題的源中:
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
// Identify this question
var thisQuestion = $('#question'+{QID}+'');
// Listener on the "Next" button
$('#movenextbtn').click(function(event){
// Compare number of clicked radios to number of array rows
if($('input.radio:checked', thisQuestion ).length != $('tr.answers-list',thisQuestion ).length) {
// Pop up a confirm message
if(confirm('You have not answered all rows.\n\nAre you sure you want to continue?')) {
return true;
}
else {
return false;
}
}
});
});
</script>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.