草庐IT

android - Cordova 表单不提交或按钮不工作 (android +4.4)

coder 2023-12-15 原文

注意:以下问题只出现在Android 4.4.2以上版本(据我所知)


长话短说

  • 问题 1:带有 click/tap/vclick/touchstart 的按钮在我的 cordova 应用程序(仅限 Android)中似乎只能部分工作(10-30% 的时间)。
  • 问题 2:我表单中的按钮(提交按钮)没有触发我的 .submit(function(){..});事件,但键盘上的“go/enter”按钮确实触发了该事件。 (也仅限 Android)


我正在尝试为 ios/android/windows 开发混合应用程序。在应用程序中,我偶尔会有需要触发某些操作的按钮。

问题 1
通常我会使用 .on('click', function() { ... }); ,但我了解到点击并不能真正与移动设备合作。相反,我要么使用 vclick , taptouchstart ,但这似乎并不总是有效。有时按钮会触发,有时会在我反复点击/点击后触发。

问题2
在其他页面上,我会有一个包裹在 <form> 中的表单。标记并包含一个 <button type="submit" id="btnSubmit">Submit form</button> .在我的 javascript 中我会有一个 .on('submit', function(e){ ... });事件来捕获表单提交,但由于另一个无法解释的原因,这似乎不起作用。

这是我的表格:

<form id="registerForm" method="post" action="#" class="ui-body ui-body-b ui-corner-all">
    <div data-role="fieldcontain" class="ui-hide-label">
        <label for="regLang" data-translation="reg_language"></label>
        <select id="regLang" name="Language">
            <!--<option value="0">EN</option>-->
            <option value="1">NL</option>
            <option value="2">FR</option>
            <!--<option value="3">DE</option>-->
        </select>
    </div>
    <div data-role="fieldcontain" class="ui-hide-label">
        <label for="regCode">Registration Code:</label>
        <input type="text" name="RegistrationCode" placeholder="Registration Code" data-translation="reg_code" id="regCode" />
    </div>
    <div data-role="fieldcontain" class="ui-hide-label">
        <label for="regEmail">E-Mail Address:</label>
        <input type="email" name="EmailAddress" placeholder="Email Address" data-translation="reg_email" id="regEmail" />
    </div>
    <div data-role="fieldcontain" class="ui-hide-label">
        <!--<label for="regPassword">Password:</label>-->
        <input type="password" name="Password" placeholder="Password" data-translation="reg_password" id="regPassword" />
    </div>
    <div data-role="fieldcontain" class="ui-hide-label">
        <button type="button" id="regRegister">
            <span data-translation="reg_register"></span>
        </button>
    </div>
</form>

这应该是触发我的表单的代码:

$("#registerForm").submit(function (e) {
    console.log("I don't even make it inside.");
});

如您在图片中所见,当我按下提交按钮时,表单将提交并执行上面的代码。但是,当我按下“Registreren”按钮时,什么也不会发生。

现在我知道你们会说,只需向按钮添加一个 onclick 事件并捕捉表单提交那样,但我将陷入第一个问题。该按钮似乎并不总是被触发..


更新

根据要求,这是我的 index.html 页面的样子,以查看我的其他脚本的概述:

<head>
    <meta charset="UTF-8" />
    <title>Application</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">

    <!-- JQuery -->
    <link rel="stylesheet" href="jquery-mobile/jquery.mobile-1.3.0.min.css" type="text/css" />

    <!-- simple dialog -->
    <link rel="Stylesheet" href="jquery-mobile/jquery.mobile.simpledialog.min.css" type="text/css" />

    <link href="styles/main_absolute.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="styles/font-awesome.min.css" type="text/css" />
    <link href="styles/app.css" rel="stylesheet" type="text/css" />

    <link href="jquery-mobile/jquery-ui/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />
    <link href="slickgrid/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css" />

    <script>
    // Prevent default errors at start of application when running in browser. 
    // However, still shows other exceptions that are needed to debug the application.
    // NOTE: comment this code if you're building the ios or android app (or windows)
        // (function () {
        //     var ConsoleBasedNativeApi = {
        //         exec: function(bridgeSecret, service, action, callbackId, argsJson) {
        //             return console.log(argsJson, 'gap:'+JSON.stringify([bridgeSecret, service, action, callbackId]));
        //         },
        //         setNativeToJsBridgeMode: function(bridgeSecret, value) {
        //             console.log(value, 'gap_bridge_mode:' + bridgeSecret);
        //         },
        //         retrieveJsMessages: function(bridgeSecret, fromOnlineEvent) {
        //             return console.log(+fromOnlineEvent, 'gap_poll:' + bridgeSecret);
        //         }
        //     };
        //     window._cordovaNative = ConsoleBasedNativeApi;
        // })();
    </script>

    <script src="cordova.js" type="text/javascript"></script>

    <script src="http://crypto-js.googlecode.com/svn/tags/3.0.2/build/rollups/md5.js" type="text/javascript"></script>
    <script src="js/lib/jquery-mobile/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="js/lib/jquery-mobile/jquery.mobile-1.3.0.min.js" type="text/javascript"></script>
        <!-- <script src="js/lib/jquery-mobile/jquery.mobile-1.4.2.js" type="text/javascript"></script> -->
    <script src="js/lib/jquery-mobile/jquery-drag/jquery.event.drag-2.2.js" type="text/javascript"></script>

    <!-- jquery progress bar -->
    <link href="styles/jqm-progress-bar/jQMProgressBar.css" rel="stylesheet" type="text/css" />
    <script src="js/lib/jquery-mobile/jquery.mobile.simpledialog2.min.js" type="text/javascript"></script>

    <!--simple dialog-->
    <script src="js/lib/jqm-progress-bar/jQMProgressBar.js" type="text/javascript"></script>

    <!-- Slickgrid -->
    <link href="slickgrid/slick.grid.css" rel="stylesheet" type="text/css" />
    <link href="slickgrid/controls/slick.pager.css" rel="stylesheet" type="text/css" />

    <script src="slickgrid/slick.core.js" type="text/javascript"></script>
    <script src="slickgrid/slick.grid.js" type="text/javascript"></script>
    <script src="slickgrid/slick.dataview.js" type="text/javascript"></script>
    <script src="slickgrid/controls/slick.pager.js" type="text/javascript"></script>

    <!-- toastr -->
    <link href="js/lib/toastr/toastr.min.css" rel="stylesheet" type="text/css" />
    <script src="js/lib/toastr/toastr.min.js" type="text/javascript"></script>

    <!-- moment -->
    <script src="js/lib/moment.min.js" type="text/javascript"></script>

    <!-- Underscore -->
    <script src="js/lib/underscore.min.js" type="text/javascript"></script>

    <script src="js/lib/jquery-plugins/data-selector.js" type="text/javascript"></script>

    <!-- statusbar -->
    <script src="js/lib/statusbar.js" type="text/javascript"></script>

    <!-- Own libs -->
    <script src="js/app/namespace.js" type="text/javascript"></script>
    <script src="js/app/translation.js" type="text/javascript"></script>
    <script src="js/app/toast.js" type="text/javascript"></script>
    <script src="js/app/config.js" type="text/javascript"></script>
    <script src="js/app/settings.js" type="text/javascript"></script>
    <script src="js/app/utils.js" type="text/javascript"></script>
    <script src="js/app/database.js" type="text/javascript"></script>
    <script src="js/app/grid.js" type="text/javascript"></script>
    <script src="js/app/sidebar.js" type="text/javascript"></script>
    <script src="js/app/logo.js" type="text/javascript"></script>

    <script src="js/app/news.js" type="text/javascript"></script>
    <script src="js/app/registration.js" type="text/javascript"></script>
    <script src="js/app/sync.js" type="text/javascript"></script>
    <script src="js/app/login.js" type="text/javascript"></script>
    <script src="js/app/cart.js" type="text/javascript"></script>
    <script src="js/app/productdetail.js" type="text/javascript"></script>
    <script src="js/app/customer.js" type="text/javascript"></script>
    <script src="js/app/recipe.js" type="text/javascript"></script>
    <script src="js/app/endlessgrid.js" type="text/javascript"></script>
    <script src="js/app/visitreports.js" type="text/javascript"></script>
    <script src="js/app/reports.js" type="text/javascript"></script>
    <script src="js/app/progresshandler.js" type="text/javascript"></script>
    <script src="js/app/departments.js" type="text/javascript"></script>
    <!-- iScroll -->

    <script src="js/lib/iscroll/iscroll.js" type="text/javascript"></script>
    <script src="js/lib/iscroll/jquery.mobile.iscrollview.js" type="text/javascript"></script>
    <link href="js/lib/iscroll/jquery.mobile.iscrollview.css" rel="stylesheet" type="text/css" />
    <link href="js/lib/iscroll/jquery.mobile.iscrollview-pull.css" rel="stylesheet" type="text/css" /> 

    <script type="text/javascript">
        $(document).bind("mobileinit", function(){
              $.mobile.hashListeningEnabled = false;
          });

    </script>
    <script src="js/app/app.js" type="text/javascript"></script>

    <!-- Debugger -->
    <!--<script src="http://192.168.100.199:8080/target/target-script-min.js#anonymous"></script>-->
    <!--<script src="http://192.168.16.125:8080/target/target-script-min.js#anonymous"></script>-->
    <!-- <script src="http://debug.phonegap.com/target/target-script-min.js#bee0a570-a515-11e3-8d7c-22000a98b3d6"></script> -->

</head>
<body>
    Content is probably not relevant and also way too long
</body>

最佳答案

在regRegister按钮上放置 Action onclick="你的函数()"

然后阅读:How to add function on button in phonegap?

关于android - Cordova 表单不提交或按钮不工作 (android +4.4),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37205038/

有关android - Cordova 表单不提交或按钮不工作 (android +4.4)的更多相关文章

  1. ruby-on-rails - 由于 "wkhtmltopdf",PDFKIT 显然无法正常工作 - 2

    我在从html页面生成PDF时遇到问题。我正在使用PDFkit。在安装它的过程中,我注意到我需要wkhtmltopdf。所以我也安装了它。我做了PDFkit的文档所说的一切......现在我在尝试加载PDF时遇到了这个错误。这里是错误:commandfailed:"/usr/local/bin/wkhtmltopdf""--margin-right""0.75in""--page-size""Letter""--margin-top""0.75in""--margin-bottom""0.75in""--encoding""UTF-8""--margin-left""0.75in""-

  2. ruby-on-rails - 'compass watch' 是如何工作的/它是如何与 rails 一起使用的 - 2

    我在我的项目目录中完成了compasscreate.和compassinitrails。几个问题:我已将我的.sass文件放在public/stylesheets中。这是放置它们的正确位置吗?当我运行compasswatch时,它不会自动编译这些.sass文件。我必须手动指定文件:compasswatchpublic/stylesheets/myfile.sass等。如何让它自动运行?文件ie.css、print.css和screen.css已放在stylesheets/compiled。如何在编译后不让它们重新出现的情况下删除它们?我自己编译的.sass文件编译成compiled/t

  3. ruby-on-rails - Rails 编辑表单不显示嵌套项 - 2

    我得到了一个包含嵌套链接的表单。编辑时链接字段为空的问题。这是我的表格:Editingkategori{:action=>'update',:id=>@konkurrancer.id})do|f|%>'Trackingurl',:style=>'width:500;'%>'Editkonkurrence'%>|我的konkurrencer模型:has_one:link我的链接模型:classLink我的konkurrancer编辑操作:defedit@konkurrancer=Konkurrancer.find(params[:id])@konkurrancer.link_attrib

  4. ruby-on-rails - 如何优雅地重启 thin + nginx? - 2

    我的瘦服务器配置了nginx,我的ROR应用程序正在它们上运行。在我发布代码更新时运行thinrestart会给我的应用程序带来一些停机时间。我试图弄清楚如何优雅地重启正在运行的Thin实例,但找不到好的解决方案。有没有人能做到这一点? 最佳答案 #Restartjustthethinserverdescribedbythatconfigsudothin-C/etc/thin/mysite.ymlrestartNginx将继续运行并代理请求。如果您将Nginx设置为使用多个上游服务器,例如server{listen80;server

  5. ruby - 无法让 RSpec 工作—— 'require' : cannot load such file - 2

    我花了三天的时间用头撞墙,试图弄清楚为什么简单的“rake”不能通过我的规范文件。如果您遇到这种情况:任何文件夹路径中都不要有空格!。严重地。事实上,从现在开始,您命名的任何内容都没有空格。这是我的控制台输出:(在/Users/*****/Desktop/LearningRuby/learn_ruby)$rake/Users/*******/Desktop/LearningRuby/learn_ruby/00_hello/hello_spec.rb:116:in`require':cannotloadsuchfile--hello(LoadError) 最佳

  6. ruby-on-rails - rspec should have_select ('cars' , :options => ['volvo' , 'saab' ] 不工作 - 2

    关闭。这个问题需要detailsorclarity.它目前不接受答案。想改进这个问题吗?通过editingthispost添加细节并澄清问题.关闭8年前。Improvethisquestion在首页我有:汽车:VolvoSaabMercedesAudistatic_pages_spec.rb中的测试代码:it"shouldhavetherightselect"dovisithome_pathit{shouldhave_select('cars',:options=>['volvo','saab','mercedes','audi'])}end响应是rspec./spec/request

  7. ruby-on-rails - s3_direct_upload 在生产服务器中不工作 - 2

    在Rails4.0.2中,我使用s3_direct_upload和aws-sdkgems直接为s3存储桶上传文件。在开发环境中它工作正常,但在生产环境中它会抛出如下错误,ActionView::Template::Error(noimplicitconversionofnilintoString)在View中,create_cv_url,:id=>"s3_uploader",:key=>"cv_uploads/{unique_id}/${filename}",:key_starts_with=>"cv_uploads/",:callback_param=>"cv[direct_uplo

  8. ruby - 如何在 Rails 4 中使用表单对象之前的验证回调? - 2

    我有一个服务模型/表及其注册表。在表单中,我几乎拥有服务的所有字段,但我想在验证服务对象之前自动设置其中一些值。示例:--服务Controller#创建Action:defcreate@service=Service.new@service_form=ServiceFormObject.new(@service)@service_form.validate(params[:service_form_object])and@service_form.saverespond_with(@service_form,location:admin_services_path)end在验证@ser

  9. ruby - JetBrains RubyMine 3.2.4 调试器不工作 - 2

    使用Ruby1.9.2运行IDE提示说需要gemruby​​-debug-base19x并提供安装它。但是,在尝试安装它时会显示消息Failedtoinstallgems.Followinggemswerenotinstalled:C:/ProgramFiles(x86)/JetBrains/RubyMine3.2.4/rb/gems/ruby-debug-base19x-0.11.30.pre2.gem:Errorinstallingruby-debug-base19x-0.11.30.pre2.gem:The'linecache19'nativegemrequiresinstall

  10. ruby - 使用 `+=` 和 `send` 方法 - 2

    如何将send与+=一起使用?a=20;a.send"+=",10undefinedmethod`+='for20:Fixnuma=20;a+=10=>30 最佳答案 恐怕你不能。+=不是方法,而是语法糖。参见http://www.ruby-doc.org/docs/ProgrammingRuby/html/tut_expressions.html它说Incommonwithmanyotherlanguages,Rubyhasasyntacticshortcut:a=a+2maybewrittenasa+=2.你能做的最好的事情是:

随机推荐