我有这个警告框,显示在表单中没有名称或没有类别或没有描述,我已经使用此警报框但在其他页面中使用php,但是,在此页面中我使用jquery来打印出来我只能一键关闭它,实际上需要两次点击才能关闭它。
jquery的
$("#UploadCover").click(function(){
if(!$("#CoverName").val()){
$(".navbar-container").append('<div class="alert danger">'+
'<span class="closebtn" onclick="this.parentElement.style.display=\'none\';">×</span>' +
'<strong>Error!</strong> Must have a name!'+
'</div>');
}else{
var sel1 = $("#addArtCat1").find("option:selected").val();
var sel2 = $("#addArtCat2").find("option:selected").val();
var sel3 = $("#addArtCat3").find("option:selected").val();
var sel4 = $("#addArtCat4").find("option:selected").val();
var sel5 = $("#addArtCat5").find("option:selected").val();
var count = 0;
var selArray = [sel1, sel2, sel3, sel4, sel5];
for(var i=1 ; i <= 5 ; i++){
if(selArray[i] == "---"){
count++
}
}
if(count >= 4){
$(".navbar-container").append('<div class="alert danger">'+
'<span class="closebtn" onclick="this.parentElement.style.display=\'none\';">×</span>' +
'<strong>Error!</strong> Must at least chose a category'+
'</div>');
}else{
if(!$("#CoverDescription").val()){
$(".navbar-container").append('<div class="alert danger">'+
'<span class="closebtn" onclick="this.parentElement.style.display=\'none\';">×</span>' +
'<strong>Error!</strong> Must have a description'+
'</div>');
}else{
alert("fsdfds");
}
}
}
});
表格
div id="popup-add-cover" class="popup-black-cover">
<div class="popup-content-wrapper addCover">
<div class="popup-content-container">
<div class="popup-content">
<form>
Cover image:<br>
<label for="coverimage-input">
<img src="Images/user.png"/ style="border: 1px solid black">
</label>
<input id="coverimage-input" type="file" required ><br>
name:<br>
<input type="text" name="CoverName" id="CoverName" size="40" required ><span style="color: red;">*</span><br>
genre:<br>
<select class = "artcategoria" name="addArtCat" id="addArtCat1">
<option value="---">---</option>
<option value="acao">Action</option>
<option value="aventura">Adventure</option>
<option value="comedia">Comedy</option>
<option value="crime">Crime</option>
<option value="drama">Drama</option>
<option value="fantasia">Fantasy</option>
<option value="gore">Gore</option>
<option value="historico">Historical</option>
<option value="horror">Horror</option>
<option value="magia">Magic</option>
<option value="artesmarciais">Martial Arts</option>
<option value="misterio">Mistery</option>
<option value="parodia">Parody</option>
<option value="policia">Police</option>
<option value="psicologico">Psychological</option>
<option value="romance">Romance</option>
</select>
<select class = "artcategoria" name="addArtCat" id="addArtCat2">
<option value="---">---</option>
<option value="acao">Action</option>
<option value="aventura">Adventure</option>
<option value="comedia">Comedy</option>
<option value="crime">Crime</option>
<option value="drama">Drama</option>
<option value="fantasia">Fantasy</option>
<option value="gore">Gore</option>
<option value="historico">Historical</option>
<option value="horror">Horror</option>
<option value="magia">Magic</option>
<option value="artesmarciais">Martial Arts</option>
<option value="misterio">Mistery</option>
<option value="parodia">Parody</option>
<option value="policia">Police</option>
<option value="psicologico">Psychological</option>
<option value="romance">Romance</option>
</select>
<select class = "artcategoria" name="addArtCat" id="addArtCat3">
<option value="---">---</option>
<option value="acao">Action</option>
<option value="aventura">Adventure</option>
<option value="comedia">Comedy</option>
<option value="crime">Crime</option>
<option value="drama">Drama</option>
<option value="fantasia">Fantasy</option>
<option value="gore">Gore</option>
<option value="historico">Historical</option>
<option value="horror">Horror</option>
<option value="magia">Magic</option>
<option value="artesmarciais">Martial Arts</option>
<option value="misterio">Mistery</option>
<option value="parodia">Parody</option>
<option value="policia">Police</option>
<option value="psicologico">Psychological</option>
<option value="romance">Romance</option>
</select>
<select class = "artcategoria" name="addArtCat" id="addArtCat4">
<option value="---">---</option>
<option value="acao">Action</option>
<option value="aventura">Adventure</option>
<option value="comedia">Comedy</option>
<option value="crime">Crime</option>
<option value="drama">Drama</option>
<option value="fantasia">Fantasy</option>
<option value="gore">Gore</option>
<option value="historico">Historical</option>
<option value="horror">Horror</option>
<option value="magia">Magic</option>
<option value="artesmarciais">Martial Arts</option>
<option value="misterio">Mistery</option>
<option value="parodia">Parody</option>
<option value="policia">Police</option>
<option value="psicologico">Psychological</option>
<option value="romance">Romance</option>
</select>
<select class = "artcategoria" name="addArtCat" id="addArtCat5">
<option value="---">---</option>
<option value="acao">Action</option>
<option value="aventura">Adventure</option>
<option value="comedia">Comedy</option>
<option value="crime">Crime</option>
<option value="drama">Drama</option>
<option value="fantasia">Fantasy</option>
<option value="gore">Gore</option>
<option value="historico">Historical</option>
<option value="horror">Horror</option>
<option value="magia">Magic</option>
<option value="artesmarciais">Martial Arts</option>
<option value="misterio">Mistery</option>
<option value="parodia">Parody</option>
<option value="policia">Police</option>
<option value="psicologico">Psychological</option>
<option value="romance">Romance</option>
</select><span style="color: red;">*</span><br>
type:<br>
<select class = "artcategoria" name="addarttipo" required>
<option value="manga">Manga</option>
<option value="mawa">Manhwa</option>
<option value="comic">Comic</option>
<option value="gagcartoon">Gag Cartoon</option>
<option value="other">other</option>
</select><span style="color: red;">*</span><br>
<textarea cols="50" rows="10" name="CoverDescription" id="CoverDescription"></textarea><span style="color: red;">*</span><br>
<input type="submit" id="UploadCover" name="UploadCover" class="buttonpopup" value="Ok">
<input type="button" id="NotUploadCover" name="NotUploadCover" class="buttonpopup" value="Cancel">
</form>
</div>
</div>
</div>
</div>
答案 0 :(得分:0)
为什么要在(.nvabar)类中追加div和span?您可以轻松地使用锚标记来显示和隐藏弹出窗口