当使用FireFox时,updatepanel中的asp.net按钮在点击时不会触发Jquery函数
asp.net button inside updatepanel not firing Jquery function on click when using FireFox
Jquery按建议编辑,问题仍然是一样的FireFox就是不接受这些Jquery
当使用chrome一切工作正常,但与FireFox按钮不触发查询功能时,点击。以下是我的web应用程序中的一个按钮示例,当使用FireFox时它不会触发:
内部查询div有一个按钮id"izprati",当它被点击它发送一些数据到邮件的代码是在。cs页面内,但也当它点击使用Jquery它关闭div id"Inquiry"和FadesIndiv id"inquiryAnswer"。当使用chrome时,一切都如预期的那样工作,但当使用FireFox时,Inquerydiv不淡出点击和InqueryAnswerdiv不淡出。
"izprati"asp.net按钮是在updatePanel与asyncPostBackTrigger
HTML:<div id="Inquiry" class="inquiry">
<img id="closeY" class="close" src="Logos/closeY.png" />
<table style="width:60%;">
<tr>
<td>
<asp:Label runat="server" ID="l1" style="font-size:30px;"> Запитване </asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="l2" runat="server" style="font-size:22px;width:100px;">Имейл</asp:Label>
</td>
<td><asp:TextBox ID="t1" runat="server" style="font-size:22px;width:300px;"></asp:TextBox></td>
<td><asp:Label ID="Label1" runat="server" style="color:red"></asp:Label></td>
</tr>
<tr>
<td><asp:Label ID="l6" runat="server" style="font-size:22px;width:100px;">Име*</asp:Label> </td>
<td><asp:TextBox runat="server" ID="t6" style="font-size:22px;width:300px;"></asp:TextBox></td>
</tr>
<tr>
<td>
<asp:Label ID="l3" runat="server" style="font-size:22px;width:100px;">Тема</asp:Label>
</td>
<td><asp:TextBox runat="server" ID="t2" style="font-size:22px;width:300px;"></asp:TextBox></td>
<td><asp:Label ID="Label2" runat="server" style="color:red"></asp:Label></td>
</tr>
<tr>
<td>
<asp:Label ID="l4" runat="server" style="font-size:22px;width:100px;">Текст</asp:Label>
</td>
<td><textarea runat="server" id="TextArea" style="height:200px;width:300px;max-height:200px;max-width:300px;"></textarea></td>
<td><asp:Label ID="Label3" runat="server" style="color:red"></asp:Label></td>
</tr>
<tr>
<td>
<asp:Label runat="server" ID="l5" style="font-size:22px;width:100px;">Телефон</asp:Label>
</td>
<td>
<asp:TextBox ID="telephone" runat="server" style="font-size:22px;width:300px"></asp:TextBox>
</td>
</tr>
<tr>
<td></td>
<td><asp:Button id="izprati" runat="server" style="width:300px;height:50px" OnClick="izprati_Click" Text="Изпрати" /></td>
<td><asp:Label runat="server" ID="answerswer"></asp:Label></td>
</tr>
</table>
<img src="Logos/q.jpg" style="position:absolute;right:50px;top:20px;height:200px;width:300px;" />
</div>
<div class="inquiryAnswer" id="inquiryAnswer">
<img id="inquiryAnswerClose" class="close" src="Logos/closeY.png" />
<div style="position:absolute;bottom:40px;right:15px;left:15px;" id="ThankYou" runat="server">
Благодарим Ви за запитването! Член на нашият екип ще се свърже с Вас до 24 часа.
</div>
</div>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="izprati" EventName="Click" />
</Triggers>
CSS: .inquiry {
position:fixed !important;
position:absolute;
top:10vh;
right:0;
bottom:0;
left:10vw;
width:80vw;
height:80vh;
background-color:white;
padding:10px;
z-index:10;
display:none;
-webkit-box-shadow: 0 0 3px 1px black;
box-shadow: 0 0 3px 1px black;
}
.inquiryAnswer {
position:fixed !important;
position:absolute;
top:30vh;
right:0;
bottom:0;
left:35vw;
width:30vw;
height:15vh;
background-color:white;
padding:25px;
z-index:10;
display:none;
-webkit-box-shadow: 0 0 3px 1px black;
box-shadow: 0 0 3px 1px black;
text-align:center;
font-size:21px;
font-weight:bold;
}
Jquery: <script>
$(document).ready(function () {
$("#izprati").click(function () {
$("#inquiryAnswer").fadeIn(1000);
$(".inquiry").fadeOut(1000);
$("#answer").text("Благодарим Ви за запитването! Член на нашият екип ще се свърже с Вас до 24 часа.");
$('<%=t1.ClientID %>').val("");
$('<%=t2.ClientID %>').val("");
$('<%=t6.ClientID %>').val("");
$('<%=TextArea.ClientID %>').val("");
$('<%=telephone.ClientID %>').val("");
});
$("#inquiryAnswerClose").click(function () { $(".inquiryAnswer").fadeOut(1000); });
});
</script>
编辑Jquery到:
<script>
function BindControlEvents() {
$('#StayOpen1').click(function () {
$("#situationalpanel").fadeOut(1000);
$('#DeluxeR').fadeOut(1000);
$('#OneBedR').fadeOut(1000);
$('#standartR').fadeIn(1000);
});
$('#StayOpen2').click(function () {
$("#situationalpanel").fadeOut(1000);
$('#standartR').fadeOut(1000);
$('#OneBedR').fadeOut(1000);
$('#DeluxeR').fadeIn(1000);
});
$('#StayOpen3').click(function () {
$("#situationalpanel").fadeOut(1000);
$('#standartR').fadeOut(1000);
$('#DeluxeR').fadeOut(1000);
$('#OneBedR').fadeIn(1000);
});
$(
'#AboutUs , #NavButton1 , #NavButton2 , #NavButton7, #NavButton3 , #NavButton4 , #NavButton5 , #NavButton6 , #NavButton7, #LinkButton4 , #LinkButton5, #LinkButton6, #LinkButton7, #LinkButton8, #LinkButton9, #LinkButton10, #LinkButton11, #LinkButton12, #LinkButton13, #LinkButton14, #LinkButton15, #LinkButton16, #LinkButton17, #LinkButton18, #LinkButton19, #LinkButton20'
).click(function () {
$('#standartR , #DeluxeR , #OneBedR').fadeOut(1000);
});
$("#LinkButton4").click(function () {
$("#map1").fadeIn(500);
});
$("#AboutUs , #NavButton3 , #NavButton4 , #NavButton5 , #NavButton6 , #StayOpen1 , #StayOpen2 , #StayOpen3 , #LinkButton17").click(function () {
$("#map1").fadeOut(100);
});
$("#izprati").click(function () {
$("#inquiryAnswer").fadeIn(1000);
$(".inquiry").fadeOut(1000);
$("#answer").text("Благодарим Ви за запитването! Член на нашият екип ще се свърже с Вас до 24 часа.");
$('<%=t1.ClientID %>').val("");
$('<%=t2.ClientID %>').val("");
$('<%=t6.ClientID %>').val("");
$('<%=TextArea.ClientID %>').val("");
$('<%=telephone.ClientID %>').val("");
});
$("#inquiryAnswerClose").click(function () { $(".inquiryAnswer").fadeOut(1000); });
}
//Initial bind
$(document).ready(function () {
BindControlEvents();
});
//Re-bind for callbacks
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(function () {
BindControlEvents();
});
</script>
JQuery选择器不支持更新面板。您需要一些变通方法来实现该功能。这里有几个链接可以帮助你-
jQuery美元(文档)。ready和UpdatePanels?
我的jquery选择器在更新内容页面板后不起作用
试试这个jquery脚本:
<script type="text/javascript">
$("body").on("click", "#button1", function () {
alert("Button was clicked.");
});
</script>
参考资料-点击这里查看链接并获得有关该问题的更多详细信息
相关文章:
- 是否有一个JS/jQuery函数可以获取某个类的每个元素的ID
- 如何在JQuery函数中定义一个值,然后调用另一个函数并使用该值
- 如何从jquery函数返回变量
- 如何将具有文本类型值的var放入jQuery函数中
- Jquery函数在错误的时间提交
- 锚链接无法使用.slideUp jquery函数
- 重新分解jQuery函数
- 如何在视图模型contet更新更新上调用Jquery函数
- 如何向这个javascript/jquery函数添加参数
- 添加类来触发jquery函数
- 更改智能表中的页面将停止JQuery函数的工作
- 使用每500ms运行一次的jquery函数是个好主意吗
- jQuery函数不能只在一个页面上工作
- 如何将jquery函数链接到vanilla选择器
- 仅在小型设备上调用jQuery函数
- 如何将jquery函数仅应用于大屏幕
- 奇怪的jquery函数行为
- Backbone listenTo不将jquery函数作为处理程序进行激发
- 在jquery函数内部设置来自jquery函数的var;t运行
- 从Jquery函数中获取一个变量