Question

我发送<option>的值的工作代码是

function getXhr() {
    var xhr = null; 
    if(window.XMLHttpRequest) // Firefox et autres
        xhr = new XMLHttpRequest(); 
    else if(window.ActiveXObject){ // Internet Explorer 
        try {
            xhr = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            xhr = new ActiveXObject("Microsoft.XMLHTTP");
        }
    } else { // XMLHttpRequest non supporté par le navigateur 
        alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
        xhr = false; 
    } 
    return xhr;
}

function go() {
    var xhr = getXhr();
    xhr.onreadystatechange = function() {
        if(xhr.readyState == 4 && xhr.status == 200) {
            leselect = xhr.responseText;
            document.getElementById('modelecontainer').innerHTML = leselect;
        }
    }

    // Ici on va voir comment faire du post
    xhr.open("POST","contenu_a_charger.php",true);

    xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');

    sel = document.getElementById('vehicule');
    idmarque = sel.options[sel.selectedIndex].value;
    xhr.send("idMarque="+idmarque);
}

我只是尝试更改前一代码的sel var，使其ID值为<li>。

我的<li>（来自php循环）

<li id="7" onclick="go()">
    <span class="badge"><?php echo $FM->etat_user;?></span>
    <span class="head"><?php echo $FM->login_user;?></span>
</li>

我的老工作选择

<select name="vehicule" id="pays" onchange="go()">
    <option value="0">Sélectionnez votre test</option>
    <option value="3">test3</option>
    <option value="1">test1</option>
    <option value="2">test2</option>
</select>

如何获取li元素的ID（＆＃34; 7＆＃34;在此示例中）？

Answer 1

由于您使用的是 jQuery （根据您的问题标签）， 您的所有代码都可以简化为：

$("#7").click(function() {
    $.post("contenu_a_charger.php", "idMarque=" + $(this).attr("id"), function(returnedData) {
        $("#modelecontainer").text(returnedData);
    });
});

这样您就不必担心任何XHR对象或浏览器兼容性。它已经是图书馆的一部分。它还使您无需在HTML中添加任何事件标记，因此您可以删除onclick="go()"。

PS 当您从JavaScript 为JavaScript事件分配处理程序时，您始终只需在处理程序中使用this即可访问{ {1}}。
（即使用event.srcElement获取this.id）的值例如：7

Answer 2

更改这些行：

sel = document.getElementById('vehicule');
idmarque = sel.options[sel.selectedIndex].value;

成：

idmarque = this.options[this.selectedIndex].value

Answer 3

如果您需要一个简单的JavaScript解决方案，您可以这样做：假设您将列表元素开始标记更改为此$(el).data("id")，您只需访问<li id="7" onclick="go(event)">函数中的ID即可：

go

编辑：显然，如果嵌套更多元素（与Anders解决方案相反），这将不再起作用。假设您无论如何都设置了列表元素的ID，为什么不这样做：

function go(event){
    var id = event.target.id || event.target.parentNode.id;
}

然后您可以访问ID作为您的函数的参数：

<li id="7" onclick="go(7)">
  <span class="badge"><?php echo $FM->etat_user;?></span>
  <span class="head"><?php echo $FM->login_user;?></span>
</li>

如何获取<li>元素js / ajax的Id值

3 个答案: