0

我正在尝试在多设备 hubrid 应用程序下实现简单的“单页应用程序”。按下按钮(并执行一些 ajax POST 查询)后,我试图将新的 HTML 插入到“正文”中:

var finalHtml = '<header class="bar bar-nav">' +
    '<h1 class="title">Some text</h1>' +
'</header>' +
'<div class="content">' +
'</div>';
console.log('Rendering: ' + finalHtml);
$('body').html(finalHtml);

什么都没发生。我看到(在调试时)正文的内部 HTML 发生了变化,但毕竟页面变成了以前的。我试过了

document.body.insertAdjacentHTML('afterbegin', finalHtml);

或者

document.getElementById('appbody').innerHTML = finalHtml;

但它不起作用。

我错过了什么?

更新: 在更新页面结束时,Javascript 控制台输出为:

HTML1300: Navigation occurred File: index.html

出于某种原因,看起来页面已刷新。为什么会这样?HTML部分:

    <form>

        <input type="text" id="login" placeholder="Login" autofocus>
        <input type="text" id="pass" placeholder="Password">
        <button class="btn btn-primary btn-block" onclick="try_login(document.getElementById('login').value, document.getElementById('pass').value, device.platform + ' ' + device.version);">
            Login
        </button>

    </form>

Javascript部分:

function try_login(username, password, dev) {

var parameters = '';

jQuery.ajax({
    type: "POST",
    url: "http://some_url/Services/Authorize",
    data: JSON.stringify(parameters),
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    crossDomain: true,
    cache: false,
    processdata: true,
    success: function (msg) {
        renderView(DataView(msg));
    },
    error: function (obj, errorMessage) {
        renderView(LoginView() + ErrorView(errorMessage));
    },

});
};
4

1 回答 1

0

问题解决了!表单中的按钮刷新页面,所以我添加type="button"到表单上的按钮。此处找到的解决方案:单击表单内的按钮时防止刷新页面

于 2014-11-05T09:17:59.460 回答