gpt4 book ai didi

jquery - HTML id 在 JQuery 中无法识别多个 onsen 页面

转载 作者:行者123 更新时间:2023-12-01 01:42:45 25 4
gpt4 key购买 nike

我正在摩纳卡尝试使用 onsen UI 的应用程序。我有多个页面,并使用 Onsen Navigator 在我的页面中导航。

第一页有登录按钮和注册按钮,可打开(推送)包含用户 ID 和电子邮件信息的注册页面。

我试图在ons.ready(function()中使用jQuery来感知按钮点击。当我单击首页上的“登录”按钮(登录)时,jQuery 会触发所需的函数,但是当我尝试单击“注册”按钮(在“注册”页面中)时,它不会触发该函数。

   <script>
ons.bootstrap();
ons.ready(function() {
// Add another Onsen UI element
console.log('I am here');
$(function() {
$("#LoginBtn").click(onLoginBtn);
$("#RegisterBtn").click(onRegisterBtn);
});
});
function onRegisterBtn()
{
console.log('Register Button in register page');
};
function onLoginBtn()
{
console.log('Login Button in Login page');
};
</script>

然后我也定义了两个函数。我正在使用两个不同的 html(login.html 和 register.html)并推送页面。

index.html:

<body>
<ons-navigator var="QubecNavigator" page="login.html">
</ons-navigator>
</body>

登录.html:

<ons-page id="loginPage">
<div class="login-form">
<input id="login_phone" type="tel" placeholder="Mobile" class="text-input--underbar" value="">
<input id="login_password" type="password" placeholder="Password" class="text-input--underbar" value="">
<br><br>
<ons-button id="LoginBtn" modifier="large--cta" class="login-button">Log In</ons-button>
<br><br>
<ons-button modifier="quiet" class="Register-button" onclick="QubecNavigator.pushPage('register.html')" >Register</ons-button>
</div>
</ons-page>

注册.html:

<ons-page id="registerpage">
<ons-toolbar>
<div class="center">Log In</div>
<div class="left">
<ons-back-button>Back</ons-back-button>
</div>
</ons-toolbar>
<div class="register-form">
<input id="reg_phone" type="tel" class="text-input--underbar" placeholder="Mobile Number" value="">
<input id="reg_email" type="email" class="text-input--underbar" placeholder="Email" value="">
<input id="reg_password" type="password" class="text-input--underbar" placeholder="Password" value="">
<br><br>
<ons-button id="RegisterBtn" modifier="large--cta" class="register-button">Register</ons-button>
<br><br>
</div>
</ons-page>

最佳答案

我认为在你的代码中,当你仅将函数绑定(bind)到按钮时 #LoginBtn id 存在。 #RegisterBtn尚未推送,所以可能 $('#RegisterBtn')返回null 。最简单的方法如下:<ons-button id="RegisterBtn" onclick="onRegisterBtn" ... > .

您也许可以在pushPage中做到这一点回调:myNavigator.pushPage('register.html', onTransitionEnd: function() { $("#RegisterBtn").click(onRegisterBtn); });

希望对你有帮助!

关于jquery - HTML id 在 JQuery 中无法识别多个 onsen 页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34818570/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com