Javascript 函数在刷新后工作，jquery语句不'；添加jquery mobile后无法工作，jquery不'；我不能用cordova在手机上工作

编辑：我打开了一个新的线程

但请随意回答这个问题。我将在9月30日把它删除。如果没有答案

几天后编辑视图： 我用js替换了很多jquery语句。现在可以了。但是刷新的问题仍然存在。如果有人有答案。例如，我试过：

$("#anchor0").live("click", dateElementClicked($("#anchor0")));

问题是他在加载页面后运行函数。但却找不到锚和脚印

原件： 我正在用cordova制作一个应用程序，并且总是只使用浏览器。不，我在安卓手机上再次测试了它，发现很多jquery功能都不能正常工作，所以我读了一点书，添加了jquery mobile（我发现它更适合UI）

我现在有一些大问题：

一些JS函数只是在手机上刷新页面（在浏览器中）后运行，什么都不起作用。例如，我在打开页面后使用函数“newDateElement（）”添加了一个新的“DateElement”（div中有一个）。在添加jq mobile之前，它运行良好。现在我需要刷新一下。即使我手动添加html中的第一个元素，我也必须刷新，以确保函数正常工作

<div data-role="main" class="ui-content">
            <div class="divRollOut" id="unrolled">
                <a data-role="button" onclick="dateElementClicked(this)">Neuen Termin Hinzufügen</a>
            </div>

        </div>

在新的功能中也存在一些问题。添加元素时，仅声明a是不够的，因为data role=“button”，但我必须手动添加类和角色

function newDateElement() {

            //$(".ui-content").append("<div class='divRollOut' id='unrolled'><a data-role='button' onclick='dateElementClicked(this)'>Neuen Termin Hinzufügen</a></div>");
            // $(".ui-content").trigger('create');

            var newDateElement = $(document.createElement('div')).attr("class", 'divRollOut');
            newDateElement.after().html("<a data-role='button' onclick='dateElementClicked(this)' class='ui-link ui-btn ui-shadow ui-corner-all' role='button'>Neuen Termin Hinzufügen</a>");
            newDateElement.appendTo(".ui-content");
            alert("newDateElement");

        }

控制台显示$（…）.parent（…）.attr（…）未定义（retunr括号中的内容）

 //gets the Number of the Dateelement of a clicked Anchor
        function getDateElementNumber(clickedAnchor) {
            alert($(clickedAnchor).attr("id"));
            alert(($(clickedAnchor).parent().attr("id")));
            return(($(clickedAnchor).parent().attr("id")).slice(-1));

        }

它处理单击“a”时发生的情况。 Id折叠或取消折叠div，在第一次单击“a”时，它添加了一个新的DateElement，并向“a”的父div添加了一些html内容

// if a is clicked the first Time
        function dateElementClickedFirstTime(clickedAnchor) {
            //adding the html stuff
            var div = $(clickedAnchor).parent(".divRollOut");
            div.attr("id", "dateElement" + numberOfAppointments);
            div.appendTo("<p id='labelDate'>Datum: <input id='day' value=''/><input id='month' value='MM'/><input class='big' id='year' value='YYYY'/></p>");
            div.appendTo("<p id='labelTime'>Uhrzeit: <input id='hour' value='hour'/><input id='min' value='min'/></p>");
            div.css("background-color", "#009688");

            //adding to apoinment list
            appointmentList[numberOfAppointments] = new Object();
            appointmentList[numberOfAppointments]["Id"] = numberOfAppointments;
            appointmentList[numberOfAppointments]["Date"] = new Date();
            appointmentList[numberOfAppointments]["RolledOut"] = true;

            //decide which Time and Date will be preconfigured
            var dateTime = appointmentList[numberOfAppointments]["Date"];

            if (numberOfAppointments == 0) {
                setCurrentTime(numberOfAppointments, dateTime);
            }

            else if (numberOfAppointments == 0) {
                dateTime.setHours(dateTime.getHours() + numberOfAppointments);
                setCurrentTime(numberOfAppointments, dateTime);
            }


            //countig up the ID counter (must come at last)
            numberOfAppointments += 1;
        }

---

好的，我将尽可能用javascript更改jquery命令……我自己在这个帖子中回答了一点问题：

 //gets the Number of the Dateelement of a clicked Anchor
        function getDateElementNumber(clickedAnchor) {
            alert($(clickedAnchor).attr("id"));
            alert(($(clickedAnchor).parent().attr("id")));
            return(($(clickedAnchor).parent().attr("id")).slice(-1));

        }

// if a is clicked the first Time
        function dateElementClickedFirstTime(clickedAnchor) {
            //adding the html stuff
            var div = $(clickedAnchor).parent(".divRollOut");
            div.attr("id", "dateElement" + numberOfAppointments);
            div.appendTo("<p id='labelDate'>Datum: <input id='day' value=''/><input id='month' value='MM'/><input class='big' id='year' value='YYYY'/></p>");
            div.appendTo("<p id='labelTime'>Uhrzeit: <input id='hour' value='hour'/><input id='min' value='min'/></p>");
            div.css("background-color", "#009688");

            //adding to apoinment list
            appointmentList[numberOfAppointments] = new Object();
            appointmentList[numberOfAppointments]["Id"] = numberOfAppointments;
            appointmentList[numberOfAppointments]["Date"] = new Date();
            appointmentList[numberOfAppointments]["RolledOut"] = true;

            //decide which Time and Date will be preconfigured
            var dateTime = appointmentList[numberOfAppointments]["Date"];

            if (numberOfAppointments == 0) {
                setCurrentTime(numberOfAppointments, dateTime);
            }

            else if (numberOfAppointments == 0) {
                dateTime.setHours(dateTime.getHours() + numberOfAppointments);
                setCurrentTime(numberOfAppointments, dateTime);
            }


            //countig up the ID counter (must come at last)
            numberOfAppointments += 1;
        }

<html>
<head>
    <title>SetDate</title>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
    <meta name="format-detection" content="telephone=no">
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">

    <link href="../../../css/jquery.mobile-1.4.5.min.css" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" type="text/css" href="../../../css/style.css">


</head>

<body>   
    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="../../../js/index.js"></script>
    <script type="text/javascript" src="../../../js/jquery.min.js"></script>
    <script type="text/javascript" src="../../../js/jquery.mobile-1.4.5.min.js"></script>


    <div data-role="page">
        <div data-role="header">               
            <h1>Zeiten</h1>
        </div>

        <div data-role="main" class="ui-content">
            <div class="divRollOut" id="unrolled">
                <a data-role="button" onclick="dateElementClicked(this)">Neuen Termin Hinzufügen</a>
            </div>

        </div>

        <div data-role="footer"  data-position="fixed">
            <a  href="Schedule_settings.html" data-transition="slide" data-direction="reverse" >Zur&uuml;ck</a>
            <a  href="Schedule_End.html" data-transition="slide" style="float: right" >Weiter</a>
        </div>
    </div> 

    <script>
        //$.mobile.loadingMessage = false;
        //$.mobile.hidePageLoadingMsg();

        //jQuery(document).on("mobileinit", function () {
        //    jQuery.mobile.autoInitializePage = false;
        //});
        // the first dateElement
        //$(document).on("mobileinit", newDateElement());
        //$(".ui-content").live(newDateElement());
        //newDateElement();
        var numberOfAppointments = 0;
        var apointment = {
            id: 0,
            date: 0,
            rolled: false
        };
        var appointmentList = new Array();

        /*$("a").click(function () {
            alert("a clicked");
            dateElementClicked(this);

        });*/
        /*Controls what happens if a dateElement is clicked:
         * 
         * if its the first time it will change to a normal dateElement
         * else it will be pop out an will be editable or shrink
         */

        function dateElementClicked(clickedAnchor) {
            newDateElement();
           /*if ($(clickedAnchor).parent().attr("id") == "unrolled")
            {
                dateElementClickedFirstTime(clickedAnchor);
                newDateElement();
            }
            else if (appointmentList[getDateElementNumber(clickedAnchor)]["RolledOut"] == true)
            {
                hideInput(getDateElementNumber(clickedAnchor));

            }
            else if (appointmentList[getDateElementNumber(clickedAnchor)]["RolledOut"] == false)
            {
                showInput(getDateElementNumber(clickedAnchor));
            }
            else
            {
                alert("Element not listed");
            }*/

        }

        //gets the Number of the Dateelement of a clicked Anchor
        function getDateElementNumber(clickedAnchor) {
            alert($(clickedAnchor).attr("id"));
            alert(($(clickedAnchor).parent().attr("id")));
            return(($(clickedAnchor).parent().attr("id")).slice(-1));

        }

        // if a is clicked the first Time
        function dateElementClickedFirstTime(clickedAnchor) {
            //adding the html stuff
            var div = $(clickedAnchor).parent(".divRollOut");
            div.attr("id", "dateElement" + numberOfAppointments);
            div.appendTo("<p id='labelDate'>Datum: <input id='day' value=''/><input id='month' value='MM'/><input class='big' id='year' value='YYYY'/></p>");
            div.appendTo("<p id='labelTime'>Uhrzeit: <input id='hour' value='hour'/><input id='min' value='min'/></p>");
            div.css("background-color", "#009688");

            //adding to apoinment list
            appointmentList[numberOfAppointments] = new Object();
            appointmentList[numberOfAppointments]["Id"] = numberOfAppointments;
            appointmentList[numberOfAppointments]["Date"] = new Date();
            appointmentList[numberOfAppointments]["RolledOut"] = true;

            //decide which Time and Date will be preconfigured
            var dateTime = appointmentList[numberOfAppointments]["Date"];

            if (numberOfAppointments == 0) {
                setCurrentTime(numberOfAppointments, dateTime);
            }

            else if (numberOfAppointments == 0) {
                dateTime.setHours(dateTime.getHours() + numberOfAppointments);
                setCurrentTime(numberOfAppointments, dateTime);
            }


            //countig up the ID counter (must come at last)
            numberOfAppointments += 1;
        }

        //Time Validation

        //gets The entered Date Values of Specific box
        function getTimeOfdateElement(numberOfAppointments) {
            var dateTime = new Date(
                    $("#dateElement" + numberOfAppointments + " #year").val(),
                    $("#dateElement" + numberOfAppointments + " #month").val(),
                    $("#dateElement" + numberOfAppointments + " #day").val(),
                    $("#dateElement" + numberOfAppointments + " #hour").val(),
                    $("#dateElement" + numberOfAppointments + " #min").val()
                    );
            return (dateTime);
        }

        //apply the the Time from Textboxes to Current Item
        function applyTime(numberOfAppointments, dateTime) {

        }

        //fills the Textboxes with current time for the first use or with the next logical
        function setCurrentTime(numberOfAppointments, dateTime) {
            $("#dateElement" + numberOfAppointments + " #day").val(dateTime.getDate());
            $("#dateElement" + numberOfAppointments + " #month").val(dateTime.getMonth());
            $("#dateElement" + numberOfAppointments + " #year").val(dateTime.getFullYear());
            $("#dateElement" + numberOfAppointments + " #hour").val(dateTime.getHours());
            $("#dateElement" + numberOfAppointments + " #min").val(dateTime.getMinutes());
        }


        //Show and Hide

        //Hides in inputs and p of certain date Element
        function hideInput(numberOfAppointments) {
            $("#dateElement" + numberOfAppointments + " #day").hide();
            $("#dateElement" + numberOfAppointments + " #month").hide();
            $("#dateElement" + numberOfAppointments + " #year").hide();
            $("#dateElement" + numberOfAppointments + " #hour").hide();
            $("#dateElement" + numberOfAppointments + " #min").hide();
            $("#dateElement" + numberOfAppointments + " #labelDate").hide();
            $("#dateElement" + numberOfAppointments + " #labelTime").hide();

            appointmentList[numberOfAppointments]["RolledOut"] = false;
        }
        //Shows in inputs and p of certain date Element
        function showInput(numberOfAppointments) {
            $("#dateElement" + numberOfAppointments + " #day").show();
            $("#dateElement" + numberOfAppointments + " #month").show();
            $("#dateElement" + numberOfAppointments + " #year").show();
            $("#dateElement" + numberOfAppointments + " #hour").show();
            $("#dateElement" + numberOfAppointments + " #min").show();
            $("#dateElement" + numberOfAppointments + " #labelDate").show();
            $("#dateElement" + numberOfAppointments + " #labelTime").show();

            appointmentList[numberOfAppointments]["RolledOut"] = true;
        }




        /*adds a new Date Element to the Container div*/
        function newDateElement() {

            //$(".ui-content").append("<div class='divRollOut' id='unrolled'><a data-role='button' onclick='dateElementClicked(this)'>Neuen Termin Hinzufügen</a></div>");
            // $(".ui-content").trigger('create');

            var newDateElement = $(document.createElement('div')).attr("class", 'divRollOut');
            newDateElement.after().html("<a data-role='button' onclick='dateElementClicked(this)' class='ui-link ui-btn ui-shadow ui-corner-all' role='button'>Neuen Termin Hinzufügen</a>");
            newDateElement.appendTo(".ui-content");
            alert("newDateElement");

        }
    </script>

</body>