JQuery 对话框删除状态图像答案

【问题标题】：JQuery Dialog remove status imageJQuery 对话框删除状态图像
【发布时间】：2017-01-08 20:11:37
【问题描述】：

我在 jQuery 对话框中有密码表单。提交表单后，我需要删除该图像，但这似乎不起作用。谁能告诉我该怎么做？

这是对话框的 HTML：

<div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
<div class="ui-dialog-buttonset">
<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only ui-state-hover" type="button" role="button" aria-disabled="false">
<span class="ui-button-text">Retrieve it</span>
</button>
<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" type="button" role="button" aria-disabled="false">
<span class="ui-button-text">Cancel</span>
</button>
</div>
<img id="password-status" class="progressStatus" title="Status" alt="Status" src="/Content/alert/progress.gif" style="">
</div>

这就是我正在做的：

$("#password-status").remove().fadeOut();

另一个尝试：

 $(".ui-dialog-buttonpane").remove($("#password-status").fadeOut());

【问题讨论】：

您真的要删除它还是只是隐藏它？如果只是想隐藏，请执行 $('#yourID').toggle();它给出了一种淡出效果。
@ricardordz ，您的解决方案很好。谢谢

标签： jquery jquery-ui jquery-ui-dialog

【解决方案1】：

如果您实际使用的是an HTML form submit，页面将被刷新，因此您不必删除它。在使用表单提交查看页面时，让您的服务器端代码不添加它。您将在 PHP 或 ASP 代码（或您使用的任何服务器端技术）中执行此操作。

如果您使用 AJAX 而不是 HTML 表单，请尝试将 id 添加到每个按钮，并通过 jQuery 绑定点击事件。

这里是a fiddle demonstrating this。

您的 HTML 已修改以添加那些 ids：

<div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
  <div class="ui-dialog-buttonset">
    <button id="retrieve-button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only ui-state-hover" type="button" role="button" aria-disabled="false">
      <span class="ui-button-text">Retrieve it</span>
    </button>
    <button id="cancel-button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" type="button" role="button" aria-disabled="false">
      <span class="ui-button-text">Cancel</span>
    </button>
  </div>
  <img id="password-status" class="progressStatus" title="Status" alt="Status"
       src="/Content/alert/progress.gif">
</div>

JS 禁用点击图片：

$("#retrieve-button").click(function() {
    // Todo: Add submit https AJAX call here, and bind success to removeImages.
    // For now, we'll just call it directly
    removeImages();
});

function removeImages() {
    $("#password-status").remove().fadeOut();
}

【讨论】：