Показывать переменную javascript в html div

Question

Показывать переменную javascript в html div

0

Как только форма отправлена, мой javascript скрывает один div и показывает другое:

function deviceReady() {
    console.log("deviceReady");
    $("#loginPage").on("pageinit",function() {
        console.log("pageinit run");
        $("#loginForm").on("submit",handleLogin);
        checkPreAuth();
    });
    $.mobile.changePage("#loginTest");
    $('#loginTest').html('Hello World!');
}

В нижней строке я пытаюсь добавить текст в div, который динамически отображается. Однако в div нет ничего. Я также хотел бы показать переменную из другой функции в том же файле.

это var e = $("#username").val(); из кода, который я хотел бы добавить в div в конце концов.

function init() {
    document.addEventListener("deviceready", deviceReady, true);
    delete init;
}

function checkPreAuth() {
    console.log("checkPreAuth");
    var form = $("#loginForm");
    if(window.localStorage["username"] != undefined && window.localStorage["password"] != undefined) {
        $("#username", form).val(window.localStorage["username"]);
        $("#password", form).val(window.localStorage["password"]);
        handleLogin();
    }
}

function handleLogin() {
    var e = $("#username").val();
    var p = $("#password").val();

    if(e != "" && p != "") {
        $.ajax({ 
                 type: 'POST', 
                 url: 'http://localhost/php/log.php', 
                 crossDomain: true,
                 data:  {username: e, password :p},
                 dataType: 'json', 
                 async: false,

                 success: function (response){ 
                    if (response.success) { 
                        $.mobile.changePage("#loginTest");
                     } 
                    else {
                        alert("Your login failed");
                    }
                 },
                 error: function(error){
                    alert('Could not connect to the database' + error);
                 }
               }); 
    }
    else {
        alert("You must enter username and password");
    }
    return false;
}

function deviceReady() {
    console.log("deviceReady");
    $("#loginPage").on("pageinit",function() {
        console.log("pageinit run");
        $("#loginForm").on("submit",handleLogin);
        checkPreAuth();
    });
    $.mobile.changePage("#loginTest");
    $('#loginTest').html('Hello World!');
}

Код HTML:

<body>
<div id="loginPage" data-role="page">
  <div data-role="header">
    <h1>Auth Demo</h1>
  </div>
  <div data-role="fieldcontain" class="ui-hide-label">
    <label for="username">Username:</label>
    <input type="text" name="username" id="username" value="" placeholder="Username" />
  </div>
  <div data-role="fieldcontain" class="ui-hide-label">
    <label for="password">Password:</label>
    <input type="password" name="password" id="password" value="" placeholder="Password" />
  </div>
  <input type="button" value="Login" id="submitButton" onclick="handleLogin()">
  <div data-role="footer">
  </div>
</div>

<div id="loginTest" data-role="page">
<div id="name">
</div>
</div>


</body>

Carla Dessi 15 апр. 2014, в 18:12

Источник

0

а ваша HTML разметка? лучше jsfiddle.net
Godinall 15 апр. 2014, в 15:38
0

Ваш HTML-код поможет ответить на этот вопрос.
Diodeus - James MacFarlane 15 апр. 2014, в 15:38
0

Нам нужен весь ваш код JavaScript, я подозреваю, что ваша функция deviceReady не работает
James King 15 апр. 2014, в 15:45
0

Я обновил его со всеми моими JavaScript
Carla Dessi 15 апр. 2014, в 15:54

Показать ещё 2 комментария

Теги:

javascript

jquery

html

css

2 ответа

Ещё вопросы

Ваш HTML-код поможет ответить на этот вопрос.
Нам нужен весь ваш код JavaScript, я подозреваю, что ваша функция deviceReady не работает
Я обновил его со всеми моими JavaScript

Dean.DePue · Answer 1 · 2014-04-15T14-48-00.000Z

Разве вы не могли бы лучше ограничить пост:

<input type="button" value="Login" id="submitButton" onClientClick="handleLogin()">

а затем вернуть значение false из функции.

Fury · Answer 2 · 2014-04-15T14-28-00.000Z

попробуйте это на элементе id loginTest (#loginTest)

document.getElementById('loginTest').innerHTML= your variable here; //or any string

если вы используете jquery

$( '#loginTest' ).text( your variable ); //or any string