【问题标题】:Can't get dialog to open in Jquery mobile无法在 Jquery mobile 中打开对话框
【发布时间】:2012-01-12 15:29:09
【问题描述】:

选择正确的值后,我想在模式对话框中打开 id="new_firm" 的 div。我无法打开对话框。我知道自从弹出警报后脚本就被执行了。谁能告诉我这里出了什么问题?

<!DOCTYPE html>
<html>
<head>
    <title>FileReader Example</title>

    <link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.0.css" />
    <script type="text/javascript" charset="utf-8" src="js/jquery-1.7.1.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/jquery.mobile-1.0.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/phonegap-1.3.0.js"></script>
    <script type="text/javascript" charset="utf-8">

        function openNewFirmDialog() {
            var selected = $("#select_firm option:selected");
            var ddValue = selected.text();
            if(ddValue === "Add a new company") {
                //alert(ddValue);
                $('#new_firm').dialog({modal:true});
            }

        }

    </script>

</head>
<body>
    <div data-role="page" id="add_details">

        <div data-role="content">
            <h2>Register hours</h2>

            <a href="#new_firm" data-rel="dialog">hei</a>

            <div data-role="fieldcontain">
                <select id="select_firm" data-native-menu="false" onchange="openNewFirmDialog()">
                <label for="select_firm"  class="select">Select firm:</label>
                <option data-placeholder="firm">Firm</option>
                <option value="internal">Internal</option>
                    <option value="new_firm_option">Add a new company</option>
                </select>
            </div>

            <input type="text" id="descritptionTxt" value="Description"/>
            <div data-role="controllgroup" data-type="horizontal">
                <input type="range" id="number_of_hours" min="0" max="24" step="0.25" value="0" />
                <input type="range" id="number_of_minutes" min="0" max="24" step="0.25" value="0" />
            </div>


        </div>

        <div data-role="footer" data-position="fixed">
            <div data-role="navbar">
                <ul>
                    <li><a href="index.html" data-icon="home">Overview</a></li>
                    <li><a href="add.html" data-icon="plus">Add hours</a> </li>
                    <li><a href="settings.html" data-icon="gear">Settings</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div data-role="page" id="new_firm">
        <h2>Add a new firm</h2>
        <textarea id="the_new_firm" value="New firm"/>
    </div>

</body>

【问题讨论】:

  • jQM 支持 jQuery 1.6.4
  • @bobek 每当我尝试与页面交互时,Firefox 崩溃。在 chrome 中“工作”很好。
  • 当您在 chrome 中单击 F12,将选项卡更改为控制台并刷新页面。单击链接打开对话框并告诉我们内容。
  • 除了加载两张图片失败外,什么也没说。还有一点需要注意的是,如果我点击链接“hei”,就会出现对话框。

标签: jquery-mobile jquery-ui-dialog


【解决方案1】:

如果你想使用对话框,我认为你需要添加对 jQuery UI 的引用。可在此处下载:http://jqueryui.com/demos/dialog/

【讨论】:

  • 好的,当我下载并包含 jquery ui 时,我得到了某种对话框。但我认为这已经在 jquery 移动脚本中了?
  • 同样在评论中@Phill PAfford jquery mobile 应该与 jQuery 1.6.4 一起使用;你使用 1.7.1
  • 已经做到了。不用找了。我不明白为什么它与 hei 和上面的脚本一起工作,而不是函数 openNewFirmDialog()
  • 将您的 div 放入新文件并链接到该页面;
  • 似乎无法让它工作。现在我正在使用这个解决方案:stackoverflow.com/questions/6230460/…
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-09-07
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多