无法在Jquery mobile中打开对话框

时间:2012-01-12 15:29:10

标签: jquery-mobile jquery-ui-dialog

当选择了正确的值时,我想在模态对话框中打开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>

1 个答案:

答案 0 :(得分:0)

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