Question

我有两个xml文件，Drinks.xml和Desserts.xml，我打算将来继续添加项目。

<?xml version="1.0" encoding="UTF-8" ?>
<DrinksMenu>
    <drink value = "1">Lemonade</drink>
    <drink value = "2">Milk Shake</drink>
</DrinksMenu>

<?xml version="1.0" encoding="UTF-8" ?>
<DessertsMenu>
    <dessert value = "1">Apple Pie</dessert>
    <dessert value = "2">Caramel Custard</dessert>
</DessertsMenu>

我使用以下HTML代码在名为Registration的wordpress页面中创建自定义表单：

<title>Using jQuery and XML to populate a drop-down box demo</title>
</head>
<body>
    <form class="form-horizontal">
        <fieldset>

            <!-- Form Name -->
            <legend>
                Form Name
            </legend>

            <!-- Text input-->
            <div class="form-group">
                <label class="col-md-4 control-label" for="textinput">Food Title</label>
                <div class="col-md-8">
                    <input id="textinput" name="textinput" type="text" placeholder="e.q. A Novel Sensation at a restaurant ..." class="form-control input-md">

                </div>
            </div>

            <!-- Select Basic -->
            <div class="form-group">
                <label class="col-md-4 control-label" for="selectbasic">Select Type</label>
                <div class="col-md-4">
                    <select id="selectbasic" name="selectbasic" class="form-control">
                        <option value="1">Drinks</option>
                        <option value="2">Desserts</option>
                    </select>
                </div>
            </div>

            <div id="page-wrap">
                <label class="col-md-4 control-label" for="selectbasic">Select Your Option</label>
                <select id="paperSelect">
                    <option value="1"></option>
                </select>
            </div>

        </fieldset>

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
        <script>
            $(document).ready(function() {
                var urlPaper;
                var elementTag;
                urlPaper = "Drinks.xml";;
                elementTag = 'drink';

                $.ajax({
                    // updatePublicationFields();
                    type : "GET",
                    url : urlPaper,
                    dataType : "xml",
                    success : function(xml) {
                        var select = $('#paperSelect');
                        select.empty();

                        var optionsHtml = new Array();
                        $(elementTag, xml).each(function() {
                            var value = $(this).attr('value');
                            var label = $(this).text();
                            optionsHtml.push("<option class='ddindent' value='" + value + "'>" + label + "</option>");
                        });
                        optionsHtml = optionsHtml.join('');
                        select.append(optionsHtml);
                    } //sucess close
                });

                $("#selectbasic").change(function() {
                    var urlPaper;
                    var elementTag;

                    if ($("#selectbasic").val() == 1) {
                        urlPaper = "Drinks.xml";
                        elementTag = 'drink';
                    } else {
                        urlPaper = "Desserts.xml";
                        elementTag = 'dessert';
                    }

                    $.ajax({

                        type : "GET",
                        url : urlPaper,
                        dataType : "xml",
                        success : function(xml) {
                            var select = $('#paperSelect');
                            select.empty();
                            var optionsHtml = new Array();
                            $(elementTag, xml).each(function() {
                                var value = $(this).attr('value');
                                var label = $(this).text();
                                optionsHtml.push("<option class='ddindent' value='" + value + "'>" + label + "</option>");
                            });
                            optionsHtml = optionsHtml.join('');
                            select.append(optionsHtml);
                        } //success close
                    });

                });

            });
        </script>

</body>

如果我在wordpress之外创建一个项目并在我的localhost上运行它，上面的代码就可以正常工作。但对于wordpress存在一些问题。现在我有两个问题，

如何让它在wordpress中运行？我的意思是我在哪里放置这些xml文件，以便wordpress查找并加载它？我无法在wordpress中工作。
我使用了一些重复的代码块，因为我无法使其工作。如何使用函数优化它？

知识渊博的人可以帮助我吗？我仍然在涉足网络技术。

如何使用xml和wordpress填充下拉列表？

0 个答案: