1. Je souhaite réaliser une enquête par questionnaire. Il y a plusieurs questions sur la page et plusieurs options sous chaque question. Enfin, il y a un bouton de soumission pour déterminer si l'utilisateur est connecté lors de la soumission. Les questions et options sont obtenues dynamiquement à partir de l'arrière-plan via $.ajax dans la page jsp et affichées au premier plan sous forme HTML. Désormais, lors de la soumission, vous devez obtenir les éléments et les questions sélectionnés et les stocker dans la base de données d'arrière-plan pour les statistiques d'arrière-plan.
2.formulaire
<form id="myform" name="myform" method="post">
<p class="sub730">
<p class="rightTitleStyle" id="rightTitle">
<span>有奖调查</span>
</p>
<p id="contentp">
<p class="newsLeftLayoutOp sceneRightLayout">
<p class="newsDetailContent">
<h2>${iyInvestigate.title}</h2>
<p class="newsDetailConMsg">
<span>发布时间:</span> <span>${iyInvestigate.createTime}</span> <span>活动结束时间:</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>
Chargement dynamique des questions et options
<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>
Fonction de soumission submitAnswer()
function submitAnswer(){
var userid = "${sessionScope.user.id}";
if(userid == '')
{
alert("未登录,跳转登录页面!");
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;
//获取每一道题目以及相应的选项
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. Le problème réside désormais dans la fonction function submitAnswer() {}
中加$.ajax({})
根本进不了js函数submitAnswer
。 去掉$.ajax({})
才可以执行submitAnswer
.
S'il vous plaît, donnez-moi quelques conseils.
Utilisez simplement des guillemets simples pour ajouter la valeur sous le paramètre data en ajax, voir le code suivant
data : {"investigateTitle": '${iyInvestigate.title}',"investigateID":'${iyInvestigate.id}',"subjectOp":'subject',"selectItemOp":'selectItem',"userid":'${sessionScope.user.id}'},
Écrivez
console.log
pour voir si la fonction est saisie.De plus, votre façon d'écrire :
Pourquoi lier des événements dans des fichiers js :
html
js
Vous pouvez essayer de mettre votre submitAnswer() dans $(document).ready(function(){})