【问题标题】:JavaScript function not triggeringJavaScript 函数未触发
【发布时间】:2016-03-16 18:58:51
【问题描述】:

我有 2 个主要函数,除了变量名和它使用的表之外,它们几乎完全相同。

我正在使用 phonegap、html、javascript、JQuery Mobile。

函数 eventSoccer 在出现第一个警报时已到达,但未存储数据输入,而只是刷新页面。

函数 registerUser 工作得非常好,显示 sql 查询并出现警报“用户已注册”并且数据在数据库中。

谁能确定为什么函数 eventSoccer 似乎不起作用?由于这两个功能几乎完美无瑕。

事件足球 -

function eventSoccer() {
    alert("eventSoccer hit");
    var TitleT = document.getElementById("txttitle").value;
    var LocationL = document.getElementById("txtlocation").value;
    var PeopleP = document.getElementById("txtpeople").value;
    var DateD = document.getElementById("txtdate").value;
    var DescriptionD = document.getElementById("txtdesc").value;

    db = window.openDatabase("SoccerEarth", "2.0", "SoccerEarthDB", 2 * 1024 * 1024);
    db.transaction(function(tx) {
        NewSoccer(tx, TitleT, LocationL, PeopleP, DateD, DescriptionD);
    }, errorEvent, successEvent);
}

function NewSoccer(tx, TitleT, LocationL, PeopleP, DateD, DescriptionD) {
    var _Query = ("INSERT INTO SoccerEvents(Title, Location, NoPeople, Date, Description) values ('" + TitleT + "','" + LocationL + "','" + PeopleP + "','" + DateD + "', '" + DescriptionD + "')");
    alert(_Query);
    tx.executeSql(_Query);
}

function errorEvent(error) {
    navigator.notification.alert(error, null, "Event not created", "cool");
}

function successEvent() {
    navigator.notification.alert("The event has now been created", null, "Information", "ok");
}

注册用户 -

function registerUser() {
    var Username = document.getElementById("txtusername").value;
    var Firstname = document.getElementById("txtfirstname").value;
    var Lastname = document.getElementById("txtlastname").value;
    var Email = document.getElementById("txtemail").value;
    var Password = document.getElementById("txtpassword").value;
    var Confirmpass = document.getElementById("passwordconfirm").value;

    db = window.openDatabase("SoccerEarth", "2.0", "SoccerEarthDB", 2 * 1024 * 1024);
    db.transaction(function(tx) {
        NewUser(tx, Username, Firstname, Lastname, Email, Password, Confirmpass);
    }, errorRegistration, successRegistration);
}

function NewUser(tx, Username, Firstname, Lastname, Email, Password, Confirmpass) {
    var _Query = ("INSERT INTO SoccerEarth(UserName, FirstName, LastName, Email, Password, CPass) values ('" + Username + "','" + Firstname + "','" + Lastname + "','" + Email + "', '" + Password + "', '" + Confirmpass + "')");
    alert(_Query);
    tx.executeSql(_Query);
}

function errorRegistration(error) {
    navigator.notification.alert(error, null, "Got an error mate", "cool");
}

function successRegistration() {
    navigator.notification.alert("User data has been registered", null, "Information", "ok");
}

HTML -

<div data-role="content">
    <br>
    <form>
        <label for="txttitle">Title</label>
        <input type="text" id="txttitle">
        <br>
        <label for="txtlocation">Location</label>
        <input type="text" id="txtlocation">
        <br>
        <label for="txtpeople">Number Of People</label>
        <input type="text" id="txtpeople">
        <br>
        <label for="txtdate">Date</label>
        <input type="text" id="txtdate">
        <br>
        <label for="textdesc">Description</label>
             <textarea name="textarea" id="textdesc"></textarea>
        <br>
        <input type="submit" value="submit" onclick="return eventSoccer()">
    </form>
</div>

【问题讨论】:

  • 什么样的 HTML 元素会触发这个功能?
  • 问题太宽泛了,因为数据太少了。您使用了很多技术,其中一种可能会导致您的问题。事实上 - 回答这个问题就像从 1 到 100 中猜测一个数字。要找到您的错误,您需要将代码分解为分离的组件。我看到这些组件可能会失败:数据库、html 输入、jquery mobile、navigator.notification.alert。把事情分开,这样你就可以分别测试这些问题。
  • 首先-可能是您的浏览器给了您console.error。它是什么?其次 - jQueryMobile 有一个非常恶心的 UI 系统,所有依赖于 id 属性的东西 - 你使用 id 作为你的文本区域。简而言之,如果您使用 jQM 并通过 ajax 加载几个页面 - 它们不得包含具有相同名称的 id。这包括重新加载同一页面。第三 - 检查您的数据库 - SoccerEvents 表是否存在。除此之外 - 我们在这里看到的只是冰山一角。这还不够。
  • 您正在使用提交,您必须阻止提交,这是您刷新表单的原因
  • $( "#form_id" ).submit(function( event ) { alert( "调用了 .submit() 的处理程序。" ); event.preventDefault(); });

标签: javascript jquery function cordova jquery-mobile


【解决方案1】:

我认为它在这里坏了:

var DescriptionD = document.getElementById("txtdesc").value;

document.getElementById("txtdesc") = null,因为你的 HTML 中没有 'txtdesc'(你有 'textdesc')

因此我们有 document.getElementById("txtdesc").value null.value - 这将肯定抛出错误,并且会中断正常执行代码。

顺便说一句 - 我很困惑这实际上是如何工作的:

<input type="submit" value="submit" onclick="return eventSoccer()">

我至少会这样写:

<input type="submit" value="submit" onclick="eventSoccer(); return false;">

所以提交点击不会发送表单?或者您的意图是发送表格?无论如何 - 这是你在这件事上的选择。

【讨论】:

  • 琼你传奇!错误的字段名称是问题,不敢相信我没有发现它,感谢您的帮助!但是,我确实有另一个从未解决的查询,如果您对此有任何反馈,那就太好了 - stackoverflow.com/questions/36036182/…
  • 我会给你一个赞成票,但我是 stackoverflow 的新手,所以我什至没有 15 个声望才能给你一个赞成票。
  • A quote from stackoverflow > help > tour - '提问的人可以将一个答案标记为“已接受”。' ^_^
  • 当我投票时 - “感谢您的反馈!一旦您总共获得 15 名声望,您的投票将改变公开显示的帖子得分”我在 14 点,非常接近!
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-06-15
  • 2013-11-12
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多