Jquery Ajax更改URL源onClick
我正试图找到一种更有效的方法来更改通过html下拉菜单解析的XML文档的源。目前,我正在使用XMLHttpRequest(),但我知道ajax会更有效。我曾多次尝试合并ajax,但对代码的编辑似乎从未奏效。我的源代码如下Jquery Ajax更改URL源onClick,jquery,html,ajax,json,Jquery,Html,Ajax,Json,我正试图找到一种更有效的方法来更改通过html下拉菜单解析的XML文档的源。目前,我正在使用XMLHttpRequest(),但我知道ajax会更有效。我曾多次尝试合并ajax,但对代码的编辑似乎从未奏效。我的源代码如下 var baseURL = ""; var xml, bb; function hl(src) { 'use strict'; return hljs.highlight('javascript', src).value
var baseURL = "";
var xml, bb;
function hl(src) {
'use strict';
return hljs.highlight('javascript', src).value;
}
function load(kind) {
'use strict';
var xhReq = new XMLHttpRequest();
var url;
switch (kind) {
case 'sean': url = baseURL + 'source/sean.xml';
break;
case 'bruce': url = baseURL + 'source/bruce.xml';
break;
case 'victoria': url = baseURL + 'source/victoria.xml';
break;
case 'chris': url = baseURL + 'source/chris.xml';
break;
}
xhReq.open('GET', url, false);
xhReq.send(null);
var xml = xhReq.responseText;
xml = xml.replace(/\t/g, ' ');
clearAll();
document.getElementById('xml').value = xml;
convert();
}
function clearAll() {
clearXML();
clearJSON();
}
function clearXML() {
document.getElementById('xml').value = '';
}
function clearJSON() {
$('.testData').empty();
bb = null;
}
function convert() {
clearJSON();
xml = document.getElementById('xml').value;
bb = jsonTest(xml); <!-- External Parsing Source from XML to JSON -->
console.log(bb.data.json());
}
然后我将返回dfd承诺并解决失败问题。保留您已有的case结构,然后使用
jQuery.get()
而不是XMLHttpRequest
,它将起作用。总是对我有用。您研究过jQuery吗?它可能有助于更好地管理ajax调用。我不确定在这个例子中你需要什么帮助。Ajax只是一个用来描述使用javascript获取页面的术语,您已经在使用XMLHttpRequest
为什么不使用url=baseURL+'source/'+kind+'xml'代码>安装开关?只是想指出“Bruce”!=你的switch语句中的“bruce”。还有其他的。@Filype我基本上是想避免ChromeWill do发出的恼人的“主线程上的同步XMLHttpRequest因其对最终用户体验的有害影响而被弃用”警告,尝试过,但现在不会触发。可能是我错过了什么
div class="block-section" id="convert">
<p>
<textarea id="xml"></textarea>
</p>
<ul class="list-unstyled list-inline">
<li class="dropdown">
<button data-toggle="dropdown" class="dropdown-toggle btn btn-default" id="ccda-menu" aria-expanded="true">
<span>Example</span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="ccda-menu">
<li>
<a onclick="load('sean')">Sean</a>
</li>
<li role="presentation" class="divider"></li>
<li>
<a onclick="load('Bruce')">Bruce</a>
</li>
<li role="presentation" class="divider"></li>
<li>
<a onclick="load('victoria')" class="ccda-load">Victoria</a>
</li>
<li role="presentation" class="divider"></li>
<li>
<a onclick="load('chris')">Chris</a>
</li>
</ul>
</li>
<li>
<button onclick="convert()" class="btn btn-default convert">Convert</button>
</li>
<li>
<button onclick="clearAll()" class="btn btn-default clear">Clear</button>
</li>
</ul>
</div>
window.YC = window.YC || {};
YC.get_data = function () {
'use strict';
var dfd = $.Deferred();
$.ajax({
url: 'source/sean.xml',
type: 'get',
dataType: 'text'
})
.fail(fail)
.success(extractData);
function extractData(summary) {
var bb = jsonTest(summary);
window.d = bb.data;
}