我正在尝试在多设备 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));
},
});
};