jQuery-ui 对话框不显示在点击事件上
Posted
技术标签:
【中文标题】jQuery-ui 对话框不显示在点击事件上【英文标题】:jQuery-ui dialog don't show on click event 【发布时间】:2018-04-04 23:06:53 【问题描述】:点击提交按钮时,我的 jQuery-ui 对话框不显示
html:
<input id="pdfsub" type="button" name="pdfsub" value="PDF">
$(document).ready(function()
$("#PDFdialog").dialog(
width: 500, autoOpen: false, resizable: false, draggable: false,
modal: false,
title: "pdf",
buttons: [
text: "Annuler",
click: function()
$( this ).dialog( "close" );
]
);
$("#pdfsub").click(function()
$("#PDFdialog").dialog("open");
alert("btn");
);
);
它显示了我的警告框,但没有显示对话框,我是不是在某个地方出错了? 我的 jQuery 和 jQuery-ui 库也在工作(在我的“连接”页面中具有相同的对话框并且它正在工作)
编辑:
有我的库
<script src="/jquery-ui-1.12.1/external/jquery/jquery.js"></script>
<script src="/jquery-ui-1.12.1/jquery-ui.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
【问题讨论】:
是您在 中的输入按钮 是的,要我编辑吗? 您的代码应该可以工作:jsfiddle.net/z_acharki/ymssceqv/193 您的代码运行良好。 jsfiddle.net/ymssceqv/194 可能是你在代码中漏掉了库。 在您的共享 HTML 中没有#PDFdialog
【参考方案1】:
您正在将对话框功能应用于您的 HTML 结构中不存在的 div,并且您也没有在 javascript/jquery 中创建它。
因此,您的 html 中必须有一个具有该 id 的元素,以便您可以在其上调用该对话框
正如您在 jQueryUI 网站上的示例中看到的那样 https://jqueryui.com/dialog/
$(document).ready(function()
$("#PDFdialog").dialog(
width: 500, autoOpen: false, resizable: false, draggable: false,
modal: false,
title: "pdf",
buttons: [
text: "Annuler",
click: function()
$( this ).dialog( "close" );
]
);
$("#pdfsub").click(function()
$("#PDFdialog").dialog("open");
);
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<input id="pdfsub" type="button" name="pdfsub" value="PDF">
<div id="PDFdialog">
</div>
【讨论】:
以上是关于jQuery-ui 对话框不显示在点击事件上的主要内容,如果未能解决你的问题,请参考以下文章
安卓 如何在点击一个按钮弹出的对话框中加入NumberPicker 并且将它的值显示在屏幕上
jQuery-UI 自动完成不会显示在 jQuery-UI 对话框中