Question

我知道这是一个经常被问到的问题，但没有答案（到现在为止）适合我。

我用 Cordova编写了一个移动应用程序。我还在浏览器（Firefox）中测试应用程序。我正在使用jQuery和jq mobile。

问题是：我的OnClick事件仅在刷新后工作，这在移动设备上是不可能的，甚至在PC上也不是解决方案。

更新：我读到，在jQuery mobile中没有再次加载ehader。所以我按照解决方案中所描述的那样对其进行了调整：page loaded differently with jQuery-mobile transition

没用。

使用alert();，您会看到脚本运行一次但在网站完全构建之前。

我的HTML：

<div data-role="main" class="ui-content" id="container" >
            <div id="container0">
                <a data-role="button"  id="anchor0" >Neuen Termin Hinzufügen</a>
            </div>
        </div>

最初<a>有一个onclick（<a onClick>="doStuff()"）

这是我不同的尝试：

$(function () {


         // Assign the click handler on DOM-ready
         $('a').on('click', function () {
         dateElementClicked(this);
         });
         });

        $(document).ready($(function () {


                // Assign the click handler on DOM-ready
                $('a').on('click', function () {
                    dateElementClicked(this);
                });
            })
        );

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

        $("a").click( dateElementClicked(this));

$("a").bind("click", function (event, ui){
            dateElementClicked(this);
        });

它们都只在刷新后才起作用。或者第一个运行函数instant并中断所有内容因为“this”未定义。

修改：

我甚至尝试使用按钮和输入类型按钮并制作额外的js文件。但我的javascript只在刷新后运行...在脚本中输入了一个控制台日志和警报。所以整个脚本都被卡住了

日期元素点击功能（我也将其清除以进行测试，并在其中添加alert()）

以下是该项目的git链接：https://github.com/LosKartoflos/Apoll.git

function dateElementClicked(clickedAnchor) {
            //anchor is clicked the first time(the id number equals numberOfAppointments)
            if (clickedAnchor.id.slice(-1) == numberOfAppointments) {
                dateElementClickedFirstTime(clickedAnchor);
            }
            else if (appointmentList[getDateElementNumber(clickedAnchor)]["RolledOut"] == true)
            {
                hideContent(getDateElementNumber(clickedAnchor));
            }
            else if (appointmentList[getDateElementNumber(clickedAnchor)]["RolledOut"] == false)
            {
                showContent(getDateElementNumber(clickedAnchor));
            }
            else
            {
                alert("Element not listed");
            }
        }

BTW：我的脚本在我的html文件中。

Answer 1

也许尝试使用deviceready事件而不是文档就绪。 https://cordova.apache.org/docs/en/4.0.0/cordova_events_events.md.html

Answer 2

试试这个

$(document).on('click', '#anchor0', function(event) {

});

或者

$(document).on('click', 'a', function(event) {

});

Answer 3

好的问题是，Cordova正在搞乱正常的构建/加载oder。在加载边后触发功能。

Cordova纪录片推荐这两个解决方案：

将它放在标题中并在onload或dofirst中绑定事件。在页面准备好后，在第一步：

中完成您想要完成的所有事情

<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
    <script src="js/script.js" type="text/javascript"></script>
    <script type="text/javascript" charset="utf-8">


        // Wait for device API libraries to load
        //add all Events (click Events)
        function onLoad() {
            document.addEventListener("deviceready", doFirst(), false);
            document.getElementById("anchor").addEventListener("click", clickedFunction, false);
        }

        // device APIs are available
        function onDeviceReady() {


        }


        //things to put up first
        function doFirst() {

        }

    </script>

或将其放在onDeviceReady函数中，在auto创建的index.js。

中

 // deviceready Event Handler
//
// The scope of 'this' is the event. In order to call the 'receivedEvent'
// function, we must explicitly call 'app.receivedEvent(...);'
onDeviceReady: function() {
    document.getElementById("anchor0").addEventListener("click", clicked, false);
    app.receivedEvent('deviceready');

},

纪录片：https://cordova.apache.org/docs/en/4.0.0/cordova_events_events.md.html

我踢出了jquery和jquery mobile。 Jquery正在弄乱文档就绪，jquery移动可以防止头部再次加载。

OnClick只能在重新加载后使用jquerymobile工作

3 个答案: