创建一个对话框 JQuery Mobile [英] Creating a dialog JQuery Mobile

查看：22
本文介绍了创建一个对话框 JQuery Mobile的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试使用 Jquery mobile 创建一个对话框.我试图参考接受的答案在这个问题中，但它对我不起作用.

这是我的代码:

 
<!-- 代码--><div id = "dialog" data-rel="dialog"><div id = "errorText"></div><button id = "closeDialog">OK</button>

这是实现它的 JS(在函数内):

//没有检查.无法继续.将错误消息添加到 div$('#errorText').html("您必须选中"我同意"旁边的复选框才能继续");//打开对话框$('#dialog').dialog();

当到达创建对话框的代码时，什么也没有发生.建议?

解决方案

对话框应该是一个单独的页面 div，您可以通过 Ajax 加载或包含在您的 HTML 中.这是一个例子.

<头><title>页面标题</title><link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css"/><script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script><script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script><身体><div data-role="页面"><div data-role="header"><h1>样品</h1>

<div data-role="内容"><p></p><p><a href="dialog.html" data-rel="dialog" data-role="button">这是个问题吗?</a></p>

<div data-role="page" data-url="dialog.html"><div data-role="header"><h1>对话框</h1>

<div data-role="内容"><p>这是一个答案吗?</p>

I am trying to create a dialog with Jquery mobile. I have tried to refer to the accepted answer in this SO question but it didn't work for me.

Here is my code:

 <div data-role="page" id="first"> 
    <!-- Code -->  
    <div id = "dialog" data-rel="dialog">
        <div id = "errorText"></div>
        <button id = "closeDialog">OK</button>
    </div>
</div>

And here is the JS to make it (inside a function):

//Nothing checked. Cannot continue. Add error message to div
$('#errorText').html("You must check the checkbox next to "I Agree" to continue");
//Open Dialog
$('#dialog').dialog();

When the code to create the dialog is reached nothing happens. Suggestions?

解决方案

The dialog should be a separate page div which you can load via Ajax or include in your HTML. Here is an example.

<!DOCTYPE html>
<html>
    <head>
    <title>Page Title</title>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>
</head>
<body>
<div data-role="page">
    <div data-role="header">
        <h1>Sample</h1>
    </div>
    <div data-role="content">
        <p></p>
        <p><a href="dialog.html" data-rel="dialog" data-role="button">Is this a question?</a></p>
    </div>
</div>
<div data-role="page" data-url="dialog.html">
    <div data-role="header">
        <h1>Dialog</h1>
    </div>
    <div data-role="content">
        <p>Is this an answer?</p>
    </div>
</div>
</body>
</html>

这篇关于创建一个对话框 JQuery Mobile的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆