Javascript Gif加载程序在订阅后不会隐藏
我正在尝试将SendGrid订阅小部件集成到我的站点中。公司提供的示例代码部分正常工作。当我点击注册按钮时,加载程序显示并显示一条成功消息,但gif加载程序即使在收到消息后也不会隐藏。我希望加载程序在进程完成后立即停止显示。我已经粘贴了js代码片段。我看不出这个问题。这可能是因为我的知识有限Javascript Gif加载程序在订阅后不会隐藏,javascript,jquery,Javascript,Jquery,我正在尝试将SendGrid订阅小部件集成到我的站点中。公司提供的示例代码部分正常工作。当我点击注册按钮时,加载程序显示并显示一条成功消息,但gif加载程序即使在收到消息后也不会隐藏。我希望加载程序在进程完成后立即停止显示。我已经粘贴了js代码片段。我看不出这个问题。这可能是因为我的知识有限 $(".sendgrid-subscription-widget").on("sent", function () { $(this).addClass("loading")
$(".sendgrid-subscription-widget").on("sent", function () {
$(this).addClass("loading")
.append("<img src=\"http://i.imgur.com/6RMhx.gif\" alt=\"Loading...\">");
$(this).find("input[type=submit").attr("disabled", "disabled");
$(".sendgrid-subscription-widget").on("success error", function () {
$(this).removeClass("loading")
$(this).find("img").remove();
$(this).find("input[type=submit").removeAttr("disabled");
});
});
HTML标记
<div class="sendgrid-subscription-widget" data-token="1M5Z249eGJzJ34D5llN3s2KkzNImaU9gZp8ImuJSw1pmhsJvugAYeWJXhtK1aWLO" data-executed="true">
<form>
<div class="response"></div>
<label>
<span>Email</span>
<input type="email" name="email" placeholder="you@example.com" />
</label>
<input type="submit" value="submit" />
</form>
<img src="http://i.imgur.com/6RMhx.gif" alt="Loading...">
</div>
将您的Js更改为:
$(".sendgrid-subscription-widget").on("sent", function () {
$(this).addClass("loading")
.append("<img src=\"http://i.imgur.com/6RMhx.gif\" alt=\"Loading...\">");
$(this).find("input[type=submit").attr("disabled", "disabled");
$(".sendgrid-subscription-widget").on("success error", function () {
$(this).removeClass("loading")
$(document).find(".loading img").remove();
$(this).find("input[type=submit").removeAttr("disabled");
});
});
好的,我解决了:这个代码现在正在工作。。。js控制台帮助了我
$(".sendgrid-subscription-widget").on("sent", function () {
$(this).addClass("loading")
.append("<img src=\"http://i.imgur.com/6RMhx.gif\" alt=\"Loading...\">");
$(this).find("input[type=submit]").attr("disabled", "disabled");
$(".sendgrid-subscription-widget").on("success error", function () {
$(this).removeClass("loading")
$(this).find("img").remove();
$(this).find("input[type=submit]").removeAttr("disabled");
});
});