使用Jquery popUp iv在标题栏的“X”按钮旁边添加了一个帮助图标。问题是,当我关闭popUp并再次打开它有2个帮助图标,关闭和打开,有3 ...等等....
我可以将显示设置为none,将其删除,但下次打开popUp时会有2个手形图标...尝试:
<script>
$('#helpIconBtn').removeClass(".ui-dialog-titlebar");
$('.helpIconBtn').removeClass(".ui-dialog-titlebar");
$('#iconhelp').removeClass(".ui-dialog-titlebar");
$('#iconhelp').removeClass(".helpIconBtn");
// $('#iconhelp').css('display', 'none');
//$(".iconhelp").removeClass
// $(".iconhelp").classList.remove(".ui-dialog-titlebar");
$("iconhelp").removeClass("helpIconBtn");
$("iconhelp").removeClass(".ui-dialog-titlebar");
</script>
代码:
var floater_style_feature_panel_popup = $("#floater_Style_Features_Panel_popup");
floater_style_feature_panel_popup.dialog({
resizable: false
},
{ width: "auto" },
{ height: "auto" },
{ position: { my: "top+45", at: "bottom", of: $("header")} },
{ show: { effect: "slideDown"} },
{dialogClass: "helpIconBtn"},
{ hide: true },
{ open: function (event, ui) {
floater_style_feature_panel_popup[0].parentNode.classList.add("opaqueDialog");
ResizeStylerDialog();
}
},
{ beforeClose: function (event, ui) {
if (closeFeatureStyler == false) {
var funcParamCall = { "funcParam": [{ "funcName": "OnFeatureStylePreClose()"}] };
$$("FeatureStyler")[0].contentWindow.postMessage(JSON.stringify(funcParamCall), "*");
alert("false");
return false;
}
else {
alert("true");
//$('#iconhelp').removeClass(".ui-dialog-titlebar");
//$('#helpIconBtn').removeClass(".ui-dialog-titlebar");
//$('.helpIconBtn').removeClass(".ui-dialog-titlebar");
// $('#iconhelp').removeClass(".helpIconBtn");
// $('#iconhelp').css('display', 'none');
// $('#iconhelp').css('display', 'none');
// $(".iconhelp").classList.remove(".ui-dialog-titlebar");
//$("iconhelp").removeClass("helpIconBtn");
//$("iconhelp").removeClass(".ui-dialog-titlebar");
return true;
}
}
},
{ closeOnEscape: true
}).parent().appendTo("form:first");
$(".helpIconBtn").children(".ui-dialog-titlebar").append("<span id='iconhelp' class='ui-icon ui-icon-help'></span>");
$("#iconhelp").click(function () {
alert('help');
});
#iconhelp{
cursor: pointer;
float: right;
margin-right:15px;
margin-top: 1px;
background-color: #EEEEEE;
width: 18px;
height: 20px;
border-radius:4px;
}
答案 0 :(得分:3)
每次用户打开弹出窗口时,很可能会附加图标,只是在弹出窗口关闭期间删除它的类。 只需检查您是否有超过一个带“iconhelp”id的跨度。
如果是这样,您可以通过两种不同的方式解决它:
删除弹出窗口中的范围:
$( '#iconhelp')除去();
不是每次都附加跨度,而是让它永久化,只需添加和删除它。
如果您采用第一种方法,请不要忘记更改以下内容:
public class CacheService {
private final Cache<Foo> fooCache;
private final Cache<Bar> barCache;
// and so on
private abstract class Cache<T> {
private final AtomicBoolean updateGuard = new AtomicBoolean(false);
private final Semaphore updateWait = new Semaphore(Integer.MAX_VALUE);
private volatile boolean isValid = true;
private volatile ImmutableList<T> lastUpdated = getUpdate();
protected abstract ImmutableList<T> getUpdate();
public void clear() {
isValid = false;
}
public ImmutableList<T> get() {
if(isValid) {
return lastUpdated;
} else {
if(updateGuard.compareAndSet(false, true)) {
try {
updateWait.drainPermits();
lastUpdated = getUpdate();
isValid = true;
} finally {
updateGuard.set(false);
updateWait.release(Integer.MAX_VALUE);
}
} else {
while(updateGuard.get()) {
try {
updateWait.acquire();
} catch(InterruptedException e) {
break;
}
}
}
return lastUpdated;
}
}
}
public CacheService() {
fooCache = new Cache<Foo>() {
@Override
protected ImmutableList<Foo> getUpdate() {
return // database query
}
};
// Likewise when initializing barCache etc
}
}
为:
$("#iconhelp").click(function () {
alert('help');
});
答案 1 :(得分:2)
我看到你在每个调用中添加一个id为 iconhelp 的span,如果需要在调用中添加它,然后在关闭弹出窗口时将其删除,为此,使用事件beforeClose并放入$('#iconhelp')。remove()这将删除您在每次调用中创建的整个元素。
{ beforeClose: function (event, ui) {
if (closeFeatureStyler == false) {
var funcParamCall = { "funcParam": [{ "funcName": "OnFeatureStylePreClose()"}] };
$$("FeatureStyler")[0].contentWindow.postMessage(JSON.stringify(funcParamCall), "*");
alert("false");
return false;
}
else {
alert("true");
//$('#iconhelp').removeClass(".ui-dialog-titlebar");
//$('#helpIconBtn').removeClass(".ui-dialog-titlebar");
//$('.helpIconBtn').removeClass(".ui-dialog-titlebar");
// $('#iconhelp').removeClass(".helpIconBtn");
// $('#iconhelp').css('display', 'none');
// $('#iconhelp').css('display', 'none');
// $(".iconhelp").classList.remove(".ui-dialog-titlebar");
//$("iconhelp").removeClass("helpIconBtn");
//$("iconhelp").removeClass(".ui-dialog-titlebar");
$("#iconhelp").remove();
return true;
}
}