1. Ich m?chte eine Fragebogenumfrage durchführen. Es gibt mehrere Fragen auf der Seite und unter jeder Frage gibt es mehrere Optionen. Schlie?lich gibt es eine Schaltfl?che zum Senden, um festzustellen, ob der Benutzer beim Senden angemeldet ist. Die Fragen und Optionen werden dynamisch aus dem Hintergrund über $.ajax auf der JSP-Seite abgerufen und im Vordergrund in HTML-Form angezeigt. Beim Absenden müssen Sie nun die ausgew?hlten Elemente und Fragen abrufen und sie für Hintergrundstatistiken in der Hintergrunddatenbank speichern.
2.Formularformular
<form id="myform" name="myform" method="post">
<p class="sub730">
<p class="rightTitleStyle" id="rightTitle">
<span>有獎?wù){(diào)查</span>
</p>
<p id="contentp">
<p class="newsLeftLayoutOp sceneRightLayout">
<p class="newsDetailContent">
<h2>${iyInvestigate.title}</h2>
<p class="newsDetailConMsg">
<span>發(fā)布時間:</span> <span>${iyInvestigate.createTime}</span> <span>活動結(jié)束時間:</span>
<span>${iyInvestigate.endtime}</span>
</p>
<p>
<span>${iyInvestigate.summary}</span>
</p>
<p id="optionp" class="test_content_nr"></p>
<p class="col-lg-9 col-lg-offset-3">
<a id="sub" href="javascript:void(0)" onclick="submitAnswer();">提交</a>
</p>
</p>
</p>
</p>
</p>
</p>
</form>
Dynamisches Laden von Fragen und Optionen
<script type="text/javascript">
$(document).ready(function(){
$.ajax({
type : "post",
dataType : "json",
url : "${ctx}/website/yjdc/investigate/findInvestigateOptionByPage.action",
data : {"id":'${iyInvestigate.id}'},
success: function(rec){
var root = "${ctx}";
var optionlist = rec.investigateOpList;
var opHTML = '<ul>';
for(var i = 0;i<optionlist.length;i++){
var option = optionlist[i];
opHTML += '<li name="optionTitle" id="qu_0_'+i+'">';
opHTML += '<p name="pOptionTitle" class="test_content_nr_tt" id="p_0_'+i+'">'+ option.subject +'</p>';
opHTML += '<p class="test_content_nr_main">';
opHTML += '<ul>';
var deoption = option.options;
var deoptionsArr = new Array();
deoptionsArr = deoption.split("|"); //選項按照|分割開
for (var j = 0; j<deoptionsArr.length;j++){
opHTML += '<li name="liSelect" class="option">';
opHTML += '<input id="0_answer_'+i+'_option_'+j+'" class="radioOrCheck" name="answer'+i+'" type="radio">'+deoptionsArr[j];
//opHTML += '<label for="0_answer_'+i+'_option_'+j+'">'+'<p class="ue" style="display: inline;">'+deoptionsArr[j]+'</p>'+'</label>';
opHTML += '</li>';
}
opHTML += '</ul>';
opHTML += '</p>';
opHTML += '</li>';
}
opHTML += '</ul>';
$('#optionp').html(opHTML);
}
})
});
</script>
Submit-Funktion subscribeAnswer()
function submitAnswer(){
var userid = "${sessionScope.user.id}";
if(userid == '')
{
alert("未登錄,跳轉(zhuǎn)登錄頁面!");
var dt = new Date();
var urlRoot = window.location.pathname;
var urlParameter = window.location.search;
var url = urlRoot + urlParameter;
window.location.href = "${pageContext.request.contextPath}/web/index/toLogin.action?url="+url+"&dt="+dt.getTime();
} else {
var k = document.getElementById('sub').innerText;
var investigateTitle = "${iyInvestigate.title}";
var indvestigateID = "${iyInvestigate.id}";
//獲取同一個主題活動下的題目集合
var subjectTitleCountObj = document.getElementsByName("pOptionTitle");
//var optionSelectCount = document.getElementsByName("liSelect").length;
//獲取每一道題目以及相應(yīng)的選項
for (var k=0;k < subjectTitleCountObj.length;k++){
//ids = optionTitleCountObj[k].id;
//存儲題目
var subject = $("#p_0_"+ k).text();
//var val_ = $('input[type="radio"][name="answer'+k+'"]:checked').val();
//存儲選中的項
var selectItem = "";
var radios = document.getElementsByName("answer"+k);
for (r = 0; r < radios.length;r++) {
if (radios[r].checked) {
selectItem = radios[r].nextSibling.data;
}
};
$.ajax({
type : "post",
dataType : "json",
url : "${ctx}/website/yjdc/investigate/submitAnswer.action",
data : {"investigateTitle": ${iyInvestigate.title},"investigateID":${iyInvestigate.id},"subjectOp":subject,"selectItemOp":selectItem,"userid":${sessionScope.user.id}},
success : function(rec)
{
}
});
// for (var j=0; j<optionSelectCount;j++){
// var select = $("#0_answer_"+k+"_option_"+j).text();
// $("input:radio:checked").val();
// }
}
}
}
</script>
3. Das Problem liegt jetzt in der function submitAnswer() {}
中加$.ajax({})
根本進不了js函數(shù)submitAnswer
。 去掉$.ajax({})
才可以執(zhí)行submitAnswer
-Funktion.
Bitte geben Sie mir einen Rat.
小伙看你根骨奇佳,潛力無限,來學(xué)PHP伐。
將ajax中data參數(shù)下的值用單引號新起來就好了,見如下代碼data : {"investigateTitle": '${iyInvestigate.title}',"investigateID":'${iyInvestigate.id}',"subjectOp":'subject',"selectItemOp":'selectItem',"userid":'${sessionScope.user.id}'},
寫個 console.log
看看函數(shù)到底有沒有進去。
再者,你這個寫法:
<a id="sub" href="javascript:void(0)" onclick="submitAnswer();">提交</a>
為什么在 js 文件中綁定事件呢:
html
<a id="sub" href="#">提交</a>
js
$('#sub').click(function(){
submitAnswer();
});