Question

我正在制作小型PHP应用程序来检索一些分类记录。由于我需要动态检索php记录而不重新加载页面，因此我使用JQuery将XMLHTTP值发送到PHP脚本。在这个应用程序中，我有六个HTML按钮，分为六个类别。和一个选择框用于选择一个数字。当用户单击此按钮之一时，它应该将按钮值和选择框值发送到另一个PHP脚本。因为我使用jquery来捕获按钮值，所以我必须将所有按钮id设置为相同。所有按钮都有on-click事件来触发java脚本函数。我的问题是，因为这六个按钮有六个不同的值，我怎么能通过XMLHTTP方法发送这些值？

这是我的HTML代码

<select id="number">
    <option value="30">30</option>
    <option value="60">60</option>
    <option value="90">90</option>
</select>
<button type="button" value="test1" id="btnval" onclick="loadXMLDoc()">test1</button>
<button type="button" value="test2" id="btnval" onclick="loadXMLDoc()">test2</button>
<button type="button" value="test3" id="btnval" onclick="loadXMLDoc()">test3</button>
<button type="button" value="test4" id="btnval" onclick="loadXMLDoc()">test4</button>
<button type="button" value="test5" id="btnval" onclick="loadXMLDoc()">test5</button>
<button type="button" value="test6" id="btnval" onclick="loadXMLDoc()">test6</button>
<button type="button" onclick="loadXMLDoc()">Search</button>

由于所有这六个按钮都具有相同的ID，因此Jquery无法正确识别值

这是我的jquery代码

    function loadXMLDoc() {

        var xmlhttp;
        if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        } else { // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("loadingDiv").innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET", "test2.php?submit=" + btnval.value + "&datebetween=" + number.value, true);
        xmlhttp.send();
    }

如何将选择框值和六个不同的按钮值发送到php脚本？

这是我的前端界面的示例 front end sample image

Answer 1

我不明白你为什么要向PHP脚本发送＆＃34;六个不同的按钮值＆＃34;：我想你的php代码只需要知道按下了六个按钮中的哪一个。

如果是这种情况，您不能简单地在函数中添加参数

function loadXMLDoc(buttonPressed)

然后使用不同的参数值修改每个按钮

<button type="button" value="test1" onclick="loadXMLDoc(1)">test1</button>
<button type="button" value="test2" onclick="loadXMLDoc(2)">test2</button>

等？

Answer 2

只要每个按钮上都有onclick="loadXMLDoc(this.value)"，就可以使用不同的ID。 this.value包含调用该函数的任何按钮的值。

另外，如果你正在尝试使用jQuery，那么，那不是jQuery，你正在使用的javascript。

Answer 3

我已经设法通过java-script

获取点击按钮值来解决这个问题

这是我正在使用的java脚本代码

function loadXMLDoc(btnval) {

            var xmlhttp;
            if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            } else { // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = function() {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    document.getElementById("loadingDiv").innerHTML = xmlhttp.responseText;
                }
            }
            xmlhttp.open("GET", "test2.php?submit=" + btnval.value + "&datebetween=" + number.value, true);
            xmlhttp.send();


    }

我用html按钮onlcik发送参数

<button type="button" value="test1"  id="btnval" onclick="loadXMLDoc(this)">test1</button>

感谢支持!!

使用附加到相同ID的HTML按钮发送不同的值

3 个答案: