当一个函数被触发时,我试图使用jQuery隐藏一个表单;然而,当我在Chrome中检查显示的页面时,表单并没有隐藏,也没有显示错误。
我使用的是jQuery:$("#showYMAward").hide();
HTML:
<form data-toggle="validator" role="form" id="showYMAwards">
<div class="container-fluid">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="jumbotron">
<h3>Joey Award Update</h3>
<!-- Place for Group Button -->
<div class="input-select" id="img-container1">
</div>
</div>
</div>
</div>
</form>
JS:
function getYMsFunction(val_AwardID) {
$("#showYMAward").hide();
alert('Hidden: ');
sessionStorage.setItem('ssAwardID', val_AwardID);
$('#ymTable tbody > tr').remove();
var dataToBeSent = {
ssAwardID : sessionStorage.getItem('ssAwardID'),
ssAwardGroupNo : sessionStorage.getItem('ssAwardGroupNo'),
};
$.ajax({
url: "GetYMandAwardDates",
data : dataToBeSent,
type: "POST",
cache: false,
})
.fail (function(jqXHR, textStatus, errorThrown) {
$('#ajaxGetUserServletResponse').text('An error occured getting the Youth Members');
})
.done(function(responseJson1a) {
$('#showAward-container').html("");
var dataToBeSent = {
ssAwardID : sessionStorage.getItem('ssAwardID'),
};
//Get the Award Image
$.ajax({
data : dataToBeSent,
type: "POST",
url: "AwardImageView",
cache: false
})
.fail (function(jqXHR, textStatus, errorThrown) {
if(jqXHR.responseText.includes('No Award found')){
$('#ajaxGetUserServletResponse').text('No Award found.');
}else{
$('#ajaxGetUserServletResponse').text('An error occured getting the Award Image');
}
})
.done(function(responseJson1) {
dataType: "json";
// JSON response to populate the Award images and dates
$(responseJson1).appendTo($("#showAward-container"));
});
dataType: "json";
// JSON response to populate the Award images and names
$(responseJson1a).appendTo($("#ymDetails"));
});
}
我已经在隐藏之后放置了一个警告,以防它隐藏起来,然后再次显示。事实并非如此。
发布于 2018-06-04 07:19:38
在你的JS的开始,你在$("#showYMAward").hide();
中有一个拼写错误,它应该是基于你在你的$("#showYMAwards").hide();
中编写它的方式。更改它并检查它是否有效。
发布于 2018-06-04 07:23:21
你的代码中有拼写错误,$("#showYMAward").hide();
需要为$("#showYMAwards").hide();
。因为您的代码中没有id为showYMAward
的元素,所以它不会隐藏任何元素。
$('#hideShowYMAward').on('click', function() {
$("#showYMAward").hide();
});
$('#hideShowYMAwards').on('click', function() {
$("#showYMAwards").hide();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form data-toggle="validator" role="form" id="showYMAwards">
<div class="container-fluid">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="jumbotron">
<h3>Joey Award Update</h3>
<!-- Place for Group Button -->
<div class="input-select" id="img-container1">
</div>
</div>
</div>
</div>
</form>
<button id="hideShowYMAwards">Click me this will work</button>
<button id="hideShowYMAward">Click me this will not work</button>
https://stackoverflow.com/questions/50671813
复制相似问题