除非您退出应用并返回,否则按钮onclick事件在iOS中不起作用,然后它将起作用 [英] Button onclick event not working in iOS unless you go away from app and back, then it works

查看:62
本文介绍了除非您退出应用并返回,否则按钮onclick事件在iOS中不起作用,然后它将起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

使用新信息更改问题

以前我问过以下问题.但是更多细节显示,如果通过取消选择某个应用程序(可能不是正确的术语)然后选择该应用程序来切换到其他应用程序,则该按钮有效.如果您关闭应用程序并重新启动,则该应用程序将无法再使用.很奇怪.我将在本段下面发布完整的页面代码,下面的所有内容都是旧问题以及------行下的部分代码

 <!DOCTYPE html>< html>< head>< meta charset ="utf-8"/><元名称=格式检测" content =电话=否"/>< meta name ="msapplication-tap-highlight" content ="no"/>< meta name ="viewport" content ="user-scaleable = no,初始比例= 1,最大比例= 1,最小-scale = 1,width = device-width"/>< meta http-equiv ="Content-Security-Policy" content ="default-src *'unsafe-inline'; style-src'self''unsafe-inline'; media-src *"/><!-< link rel ="stylesheet" type ="text/css" href ="css/fontawesome-all.css"/>->< script defer src ="js/fontawesome-all.js"></script>< script src ="framwork7/framwork7.js"></script>< script type ="text/javascript" src ="cordova.js"></script>< script src ="js/jquery-3.3.1.js"></script>< script src ="js/bootstrap.js"></script>< script src ="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/poppe.min.js"></script>< script type ="text/javascript" src ="js/news-feed.js"></script>< script type ="text/javascript" src ="js/index.js"></script>< link rel ="stylesheet" type ="text/css" href ="css/bootstrap.css"/>< link rel ="stylesheet" type ="text/css" href ="css/index.css"/>< script>var xmlhttp;var url;/* window.onload = function(){document.addEventListener("deviceready",init);}*/document.addEventListener("deviceready",init,false)函数init(){document.getElementById('Submit').addEventListener('click',getData);}函数getData(){url ="http://www.example.org/myapp.php";url + =?cemetery =" + document.getElementById('cemetery').value;url + =& lastname =" + document.getElementById('lastname').value;url + =& first =" ="+ document.getElementById('firstname').value;$ .ajax({类型:获取",网址:url,成功:功能(数据){document.getElementById('laloinfo').innerHTML =";document.getElementById('laloinfo').innerHTML =< strong>向下滚动以获取结果</strong>";/* document.getElementById('lalo2').innerHTML =数据;*/$(#lalo2").html(data);}});}</script>< title>天主教墓地移动应用程序</title></head><身体>< nav class ="navbar navbar-expand-md navbar-dark bg-primary mb-3">< div class ="container">< a class ="navbar-brand" href =#">天主教公墓</a>< button class ="navbar-toggler" data-toggle =折叠" data-target =#navbarNav">< span class ="navbar-toggler-icon">↓</span></button>< div class ="collapse navbar-collapse" id ="navbarNav">< ul class ="navbar-nav">< li class ="nav-item">< a class ="nav-link" href ="index.html">< i class ="fas fa-home"></i>主页</a></li>< li class ="nav-item">< a class ="nav-link active" href ="lalo.html">< i class ="fas fa-heart"></i>找到一个亲人.</li>< li class ="nav-item">< a class ="nav-link" href =#" onclick ="window.open('http://www.example.org','_system');">< i class ="fas fa-cloud</i>网站</a></li>< li class ="nav-item">< a class ="nav-link" href ="locations.html">< i class ="fas fa-phone"></i>位置与地点联系人</a></li>< li class ="nav-item">< a class ="nav-link" href =#" onclick ="window.open('https://facebook.com/myfacebook','_system');">< i class ="fab fa-facebook></i>Facebook</a></li>< li class ="nav-item">< a class ="nav-link" data-toggle ="modal" data-target =#aboutModal" href =#aboutModal">< i class ="fas fa-question"></i>关于版本</a></li></ul></div></div></nav>< div class ="container text-center">< h1>我的名字</h1>< p class ="lead">欢迎使用我的名字Mobile App</p>< div class ="row"><!-拉罗->< div class ="card bg-light" id ="lalo">< div class ="card-header">< h3>< i class ="far fa-heart"</i>找到一个爱的人/h3/div< div class ="card-body">< div class ="text-justify">天主教公墓自豪地宣布我们的新< strong>找到亲人的地方</strong>搜索引擎.输入您所爱的人的名字以获取位置信息,例如土窖/壁section,剖面,行和坟墓编号.</div>< br>< div class ="text-justify"< strong>您必须选择一个墓地和至少一个姓氏才能搜索数据库.< br>< div class ="text-justify bg-info">< i>请注意:请等待大约一周时间,以便当前活动出现在此搜索引擎中.如果找不到您所爱的人,请致电适当的墓地寻求帮助.< br>< div class ="form-group text-left">< label for =公墓">公墓:必需</label><选择id ="cemetery" class ="form-control-sm">< option value ="1">中村J公墓</option>< option value ="3"> C Farmingdale C公墓</option>< option value ="4"> M墓地,法拉盛</option>< option value ="2">布鲁克林H公墓</option></select></div>< div class ="form-group text-left">< label for ="lastname">姓氏:必填-Parital OK</label>< input type ="text" maxlength ="50" id ="lastname" class ="form-control form-control-sm" placeholder =输入姓氏"></div>< div class ="form-group text-left">< label for ="firstname">名字:</label><输入type ="text" maxlength ="30" id =名字" class ="form-control form-control-sm"占位符=输入名字"></div><输入type ="hidden" name ="timecounter" value =提交">< br>< button class ="btn btn-primary" name ="Submit" value ="Search" id ="Submit">〜SEARCH〜</button>< br/></div></div><!-拉罗-></div></div><!-MODAL->< div class ="modal" id ="aboutModal">< div class ="modal-dialog">< div class ="modal-content">< div class ="modal-header">< h5 class ="modal-title">我的名字移动应用</h5>< button class ="close" data-dismiss ="modal"& times;</button></div>< div class ="modal-body">移动应用程序版本2.0.9< br/>< br/>如果您在使用此应用程序时遇到问题,请与我联系并给他们上面的版本号.</div>< hr/>< div class ="modal-footer">< button class ="btn btn-primary" data-dismiss ="modal"> Close</button></div></div></div></div>< footer>< p class ="text-center">版权& copy;2018年,我</p</footer></body></html> 

-----------------------------下面的旧问题------------------------------

我尝试了10种找到的解决方案,但都无济于事.我有一个不能仅仅提交的表单,因为它接收回数据然后放入div.此代码适用于android,但不适用于iOS.(这是一个使用framework7和bootstrap,然后使用phonegap构建的HTML 5应用程序).这是一种搜索表单,可提交到服务器php页面,并将结果取回并放入div中.当您单击按钮时,iOS不会执行任何操作.

这是按钮代码:

 < button class ="btn btn-primary" name ="Submit" value ="Search" id ="Submit">〜SEARCH〜</button> 

以下是处理程序代码:

 < script>var xmlhttp;var url;window.onload = function(){document.addEventListener("deviceready",init,false);}函数init(){document.getElementById('Submit').addEventListener('click',getData,false);}函数getData(){url ="http://www.mywebsite.org/myapp.php";url + =?cemetery =" + document.getElementById('cemetery').value;url + =& lastname =" + document.getElementById('lastname').value;url + =& first =" ="+ document.getElementById('firstname').value;$ .ajax({类型:获取",网址:url,成功:功能(数据){document.getElementById('laloinfo').innerHTML =";document.getElementById('laloinfo').innerHTML =< strong>向下滚动以获取结果</strong>";/* document.getElementById('lalo2').innerHTML =数据;*/$(#lalo2").html(data);}});} 

在此先感谢您的帮助.它使我发疯,并且经历了一周的酷刑.

约翰

解决方案

下面是一个视频,演示了如何直接调试iOS WebView.

步骤是:

  1. 在Mac上的Safari中,转到首选项...->高级,然后启用在菜单栏中显示开发"菜单
  2. 确保应用程序在模拟器上运行
  3. 在Safari中,选择开发->模拟器-iPhone(型号)->选择WebView -注意,当您在菜单中将鼠标悬停在WebView上时,WebView将会突出显示
  4. 开始Javascript调试

CHANGING QUESTION WITH NEW INFO

Previously I asked the question below. But more details show that if you go to switch to a different app by going to unselect the app (may not be the right term) and then selecting the app, the button works. If you shut down the app and restart it doesn't work again. Very strange. I'm posting the complete page code below this paragraph, everything below that is the old question and partial code under the ------ line

    <!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <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" />
        <meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *" />

    <!--<link rel="stylesheet" type="text/css" href="css/fontawesome-all.css" />-->

        <script defer src="js/fontawesome-all.js"></script>
        <script src="framwork7/framwork7.js"></script>
        <script type="text/javascript" src="cordova.js"></script><script src="js/jquery-3.3.1.js"></script>
        <script src="js/bootstrap.js" ></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/poppe.min.js"></script>
        <script type="text/javascript" src="js/news-feed.js"></script>
        <script type="text/javascript" src="js/index.js"></script>

        <link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
        <link rel="stylesheet" type="text/css" href="css/index.css" />
        <script>
            var xmlhttp;
            var url;

/* window.onload = function()
      {
          document.addEventListener("deviceready", init);
      }
      */
            document.addEventListener("deviceready", init, false)

            function init(){
                document.getElementById('Submit').addEventListener('click', getData);
            }


            function getData(){
                url = "http://www.example.org/myapp.php";
                url += "?cemetery=" + document.getElementById('cemetery').value;
                url += "&lastname=" + document.getElementById('lastname').value;
                url += "&firstname=" + document.getElementById('firstname').value;

                $.ajax({
                    type: 'get',
                    url: url,
                    success: function(data){
                        document.getElementById('laloinfo').innerHTML = "";
                        document.getElementById('laloinfo').innerHTML = "<strong>Scroll down for results</strong>"; 
                        /* document.getElementById('lalo2').innerHTML = data; */
                        $("#lalo2").html(data);
                    }
                });
            }
        </script>
        <title>Catholic Cemeteries Mobile App</title>
    </head>


    <body>
<nav class="navbar navbar-expand-md navbar-dark bg-primary mb-3">
  <div class="container">
    <a class="navbar-brand" href="#">Catholic Cemeteries</a>
    <button class="navbar-toggler" data-toggle="collapse" data-target="#navbarNav"><span class="navbar-toggler-icon"> ↓  </span></button>
    <div class="collapse navbar-collapse" id="navbarNav">
      <ul class="navbar-nav">
        <li class="nav-item">
          <a class="nav-link" href="index.html"><i class="fas fa-home"></i> Home</a>
        </li>
        <li class="nav-item">
          <a class="nav-link active" href="lalo.html"><i class="fas fa-heart"></i> Locate a Loved One</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="#" onclick="window.open('http://www.example.org','_system');"><i class="fas fa-cloud"></i> Website</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="locations.html"><i class="fas fa-phone"></i> Locations & Contact</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="#" onclick="window.open('https://facebook.com/myfacebook','_system');"><i class="fab fa-facebook"></i> Facebook</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="modal" data-target="#aboutModal" href="#aboutModal"><i class="fas fa-question"></i> About Version</a>
        </li>
      </ul>
    </div>
  </div>
</nav>

    <div class="container text-center">
      <h1>myname</h1>
      <p class="lead">Welcome to the my name Mobile App</p>

  <div class="row">

    <!-- LALO -->
    <div class="card bg-light" id="lalo">

        <div class="card-header"><h3><i class="far fa-heart"></i> Locate a Loved One</h3></div>

        <div class="card-body">
        <div class="text-justify">Catholic Cemeteries is proud to announce our new <strong>Locate a Loved One</strong> search engine. Enter your loved one's name to get location information such as crypts / niches, section, row, and grave number.</div>
    <br>
        <div class="text-justify"><strong>You must choose a cemetery and at least a partial last name to search the database.</strong></div>
    <br>
        <div class="text-justify bg-info"><i>Please Note: Please allow approximately one week for current activity to appear in this search engine. If you can not find your loved one, please call the appropriate cemetery for assistance.</i></div>
        <br>

                <div class="form-group text-left">
                    <label for="cemetery">Cemetery: Required</label>
                    <select id="cemetery" class="form-control-sm">
                        <option value="1">J Cemetery, Middle Village</option>
                        <option value="3">C Cemetery, Farmingdale</option>
                        <option value="4">M Cemetery, Flushing</option>
                        <option value="2">H Cemetery, Brooklyn</option>
                    </select>
                </div>
                <div class="form-group text-left">
                    <label for="lastname">Last Name: Required - Parital OK</label>
                    <input type="text" maxlength="50" id="lastname" class="form-control form-control-sm" placeholder="Enter Last name">
                </div>
                <div class="form-group text-left">
                    <label for="firstname">First Name: </label>
                    <input type="text" maxlength="30" id="firstname" class="form-control form-control-sm" placeholder="Enter First name">
                </div>
<input type="hidden" name="timecounter" value="Submit">
            <br><button class="btn btn-primary" name="Submit" value="Search" id="Submit">~SEARCH~</button><br/>         
        </div>
</div>
    <!-- LALO -->
  </div>
</div>
<!-- MODAL -->
   <div class="modal" id="aboutModal">
     <div class="modal-dialog">
       <div class="modal-content">
         <div class="modal-header">
           <h5 class="modal-title">My Name Mobile App</h5>
           <button class="close" data-dismiss="modal">&times;</button>
         </div>
         <div class="modal-body">
           Mobile App version 2.0.9<br/>
           <br/>
           If you are having an issue with this app, please contact me and give them the version number above.
         </div>
           <hr/>
         <div class="modal-footer">
           <button class="btn btn-primary" data-dismiss="modal">Close</button>
         </div>
       </div>
     </div>
   </div>
<footer><p class="text-center">copyright &copy; 2018, me</p></footer>




</body>
</html>

-----------------------------OLD QUESTION BELOW------------------------------

I've tried 10 solutions that I've found and none work. I have a form that can't just submit because it receives back data to then put into a div. This code is working for android, but not iOS. (This is an HTML 5 app using framework7 and bootstrap, then built with phonegap). It is a search form that submits to a server php page and takes the results back and puts them into a div. iOS does nothing when you click on the button.

Here is the button code:

<button class="btn btn-primary" name="Submit" value="Search" id="Submit">~SEARCH~</button>

Here is the handler code:

  <script>
  var xmlhttp;
  var url;

  window.onload = function()
  {
      document.addEventListener("deviceready", init, false);
  }

  function init()
  {


    document.getElementById('Submit').addEventListener('click', getData, false );
  }

  function getData(){

    url = "http://www.mywebsite.org/myapp.php";
      url += "?cemetery=" + document.getElementById('cemetery').value;
      url += "&lastname=" + document.getElementById('lastname').value;
      url += "&firstname=" + document.getElementById('firstname').value;

    $.ajax({
        type: 'get',
        url: url,
        success: function(data){
            document.getElementById('laloinfo').innerHTML = "";
            document.getElementById('laloinfo').innerHTML = "<strong>Scroll down for results</strong>";
            /* document.getElementById('lalo2').innerHTML = data; */
            $("#lalo2").html(data);

        }
    });

}

Thank you in advance for any help. It's driving me nuts and has been a week of torture.

John

解决方案

Here's a video demonstrating how to debug an iOS WebView directly.

https://youtu.be/gZUj4KfFpQ4

This should make it easy to see where you're going wrong.

To create and open a Cordova app in Xcode for debugging:

[ ~] cordova create TestApp com.mydomain.testapp "TestApp"
Creating a new cordova project.
[ ~] cd TestApp/
[ ~/TestApp] cordova platform add ios --save
Using cordova-fetch for cordova-ios@~4.5.4
Adding ios project...
Creating Cordova project for the iOS platform:
    Path: platforms/ios
    Package: com.mydomain.testapp
    Name: TestApp
iOS project created with cordova-ios@4.5.4
Discovered plugin "cordova-plugin-whitelist" in config.xml. Adding it to the project
Installing "cordova-plugin-whitelist" for ios
Adding cordova-plugin-whitelist to package.json
Saved plugin info for "cordova-plugin-whitelist" to config.xml
--save flag or autosave detected
Saving ios@~4.5.4 into config.xml file ...

[ ~/TestApp] open platforms/ios/TestApp.xcworkspace
[ ~/TestApp]

At this point in Xcode just choose your simulator and click the Run triangle:

The steps are:

  1. On the Mac in Safari, go to Preferences... -> Advanced and enable Show Develop menu in the menu bar
  2. Ensure the app is running on the simulator
  3. In Safari choose Develop -> Simulator -- iPhone (model) -> choose the WebView -- note the WebView will highlight as you mouse over it in the menu
  4. Begin Javascript debugging

这篇关于除非您退出应用并返回,否则按钮onclick事件在iOS中不起作用,然后它将起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆