Question

我正在编写一个程序，使用AJAX从表单中获取信息，我想知道是否有办法制作一个清除表单的按钮，并重置表单。现在，如果你按一个按钮，文本将不会消失，但我希望制作一个主页按钮，使文本消失。我只是要发布我的.html文件，因为我认为这就是我们所需要的。如果您需要更多代码，请告诉我。我尝试制作一个重置按钮，但它似乎没有用。

<!DOCTYPE html>
<html>
<head>
<title>Assignment8</title>
<script src="ajax.js"></script>
<script>

function getXML() {
        var xmlHttp = xmlHttpObjCreate();
        if (!xmlHttp) {
                alert("The browser doesn't support this action.");
                return;
        }

        xmlHttp.onload = function() {
                if (xmlHttp.status == 200) {
                        // Get XML Document
                        var xmlDoc = xmlHttp.responseXML;

                        // Variable for our output
                        var output = '';

                        // Build output by parsing XML
                        dinos = xmlDoc.getElementsByTagName('title');

                        for (i = 0; i < dinos.length; i++) {
                                output += dinos[i].childNodes[0].nodeValue + "<br>";
                        }

                        // Get div object
                        var divObj = document.getElementById('dinoXML');

                        // Set the div's innerHTML
                        divObj.innerHTML = output;
                }
        }

        xmlHttp.open("GET", "dino.xml", true);
        xmlHttp.overrideMimeType("text/xml")
        xmlHttp.send();
}


function getJSON() {
        var xmlHttp = xmlHttpObjCreate();
        if (!xmlHttp) {
                alert("The browser doesn't support this action.");
        return;
        }
        xmlHttp.onload = function() {
                if (xmlHttp.status == 200) {

                        // Get Response Text
                        var response = xmlHttp.responseText;

                        // Prints the JSON string
                        console.dir(response);

                        // Get div object
                        var divObj = document.getElementById('dinoJSON');

                        // We used JSON.parse to turn the JSON string into an object
                        var responseObject = JSON.parse(response);

                        // This is our object
                        console.dir(responseObject)

                        // We can use that object like so:
                        for (i in responseObject) {
 divObj.innerHTML += "<p>"+responseObject[i].name + " lived during the " + responseObject[i].pet + "period.</p>";
}  
}
}
        xmlHttp.open("GET", "json.php", true);
        xmlHttp.send();
} 

</script>
</head>
<body>
<form>
<h3> Dinosaur Web Services </h3>
<div id="home"></div>
<button type="reset" value="Reset"> Home</button>

<div id="dinoJSON"></div>
<button type="button" onclick="getJSON();"> JSON Dinos</button>


 <div id="dinoXML"></div>
 <button type="button" onclick="getXML();"> XML Dinos</button>
 </form>
 </body>
 </html>

Answer 1

您的重置按钮应该已经执行此操作，如果它在<form></form>内或具有＆＃34;表单＆＃34; -attribute，请参阅here

Answer 2

您可以使用默认重置按钮，如果它位于表单标记之间，也可以使用jquery为您执行此操作。你只需要在主页按钮的click事件上添加一个事件，你就可以达到你想要的效果。

这是你可以参考的参考

$（＆＃34; .reset＆＃34;）。click（function（）{ $（this）.closest（＆＃39; form＆＃39;）。find（＆＃34;输入[type = text]，输入[type =＆＃34;密码＆＃34;]，textarea＆＃34;）。 VAL（＆＃34;＆＃34）; }）;

点击主页按钮

添加您要清除的所有其他字段

如何创建一个清除我的表单的按钮

2 个答案: