【发布时间】:2016-05-18 05:09:52
【问题描述】:
我有一个像这样的 HTML 表单:
<div id="dialogGlobal" title="About You">
<form>
<fieldset style="border: none;">
<ul style="list-style-type: none; padding-left: 0px">
<li><label for="username">Please Enter Your First Name</label></li>
<li><input type="text" name="username" id="username" placeholder="Enter your name" pattern="[A-Za-z]{3,}" title="Your first name must be at least 3 letters" class="text ui-widget-content ui-corner-all" required></li>
<li><label for="zipcode">Please Enter Your Zipcode</label></li>
<li><input type="text" name="zipcode" maxlength="5" pattern="[0-9]{5}" id="zipcode" title="Please enter a 5 digit zip-code" placeholder="02134" class="text ui-widget-content ui-corner-all" required></li>
</ul>
</fieldset>
</form>
</div>
以及对应的JQuery-ui javascript
dialogGlobal = $( "#dialogGlobal" ).dialog({
autoOpen: false,
height: 300,
width: 350,
modal: true,
position: {
my: "center center",
at: "center center",
of: "#map"
},
buttons: [{
text: "Submit",
click: function() {
if(checkValues();){
dialogGlobal.dialog("close");
}
else{
alert("Invalid input");
}
}
},
id: "globalAccept"
}],
close: function() {
},
//Hack to avoid "ENTER" leading to a new page...
open: function(){
$("#dialogGlobal").keydown(function(e) {
if (e.keyCode == $.ui.keyCode.ENTER) {
$("#globalAccept").trigger("click");
}
});
}
});
当我在 FF 和 Chrome 中单击“提交”时,一切正常。在 IE 11(在 Surface RT 上)中,没有任何反应,我什至添加了一个警报,表明该按钮已被单击,但它没有弹出。我尝试添加一个$("#dialogGlobal").on("click",function(){dothesamething});,但即使具有该侦听器的其他对象表现正常,仍然什么也没有……
【问题讨论】:
-
是点击触摸界面吗?如果是,您是否尝试过 $("#dialogGlobal").on("touchstart",function(){dothesamething})
-
@yezzz,很好的建议,但那不起作用:(用户界面的其他功能在点击时可以正常工作... on("click",) 所以我很困惑为什么这是特定的自定义对话框元素
-
好吧,我刚刚去了jqueryui.com/dialog/#modal-form,它在ie11上运行良好。您检查了 console.log 是否有错误?
-
您可能还想将 #dialogGlobal 设置为更高的 z-index 以确认这不是浏览器渲染问题
-
@yezzz 上面的链接在 Surface 上工作,所以我将尝试复制他们在那里所做的事情。我想我们已经将它设置为由于之前的问题而设置的最高 z-index
标签: javascript jquery html internet-explorer jquery-ui-dialog