Jquery Ajax更改URL源onClick

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

我正试图找到一种更有效的方法来更改通过html下拉菜单解析的XML文档的源。目前,我正在使用XMLHttpRequest(),但我知道ajax会更有效。我曾多次尝试合并ajax,但对代码的编辑似乎从未奏效。我的源代码如下

    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;
    }