Php 通过无序列表（下拉菜单）实现AJAX

我想知道我是否可以在不使用forms/select的情况下将值传递到我的ajax/php调用。 这可以通过ul或li完成吗

我的代码：

<script>
function showUser(str)
{
    if (str=="")
    {
        document.getElementById("activities").innerHTML="";
        return;
    } 
    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("activities").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","branch.php?q="+str,true);
    xmlhttp.send();
}
</script>
<nav class="dropdown">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-list"></i><span id="Branch">&nbsp;Activites</span></a>
    <ul class="dropdown-menu">
        <li>Option1</li>
        <li>Option2</li>
        <li>Option3</li>
        <li>Option4</li>
    </ul>
</nav>

函数showUser（str）
{
如果（str==“”）
{
document.getElementById（“活动”）.innerHTML=“”；
返回；
} 
if（window.XMLHttpRequest）
{
//IE7+、Firefox、Chrome、Opera、Safari的代码
xmlhttp=新的XMLHttpRequest（）；
}
其他的
{
//IE6、IE5的代码
xmlhttp=新的ActiveXObject（“Microsoft.xmlhttp”）；
}
xmlhttp.onreadystatechange=函数（）
{
if（xmlhttp.readyState==4&&xmlhttp.status==200）
{
document.getElementById（“活动”）.innerHTML=xmlhttp.responseText；
}
}
open（“GET”、“branch.php？q=“+str，true”）；
xmlhttp.send（）；
}

选择1
选择2
选择3
选择4

“选择菜单”正在运行，但我想要这样的菜单：

选择1
选择2
选择3
选择4

考虑使用jQuery加快开发速度，但在此之前，您可以使用

<ul id="myMenu">
  <li>content</li>
  ...
</ul>

<script>
document.getElementById('myMenu').addEventListener('click', function(event) {
  if ('li' != event.target.tagName) {
    return;
  }

  var str = event.target.innerText;
  showUser(str);
}, false);
</script>

---

哈哈，我找了这么多小时。。。这就是解决方案，非常简单：-D谢谢@Cernunos！！！！！！！！！！！没问题。如果您使用的是原生javascript而不是像jQuery这样的已建立的库，请确保在多个浏览器中测试javascript，尽管我认为在这种情况下应该是安全的。

<ul id="myMenu">
  <li>content</li>
  ...
</ul>

<script>
document.getElementById('myMenu').addEventListener('click', function(event) {
  if ('li' != event.target.tagName) {
    return;
  }

  var str = event.target.innerText;
  showUser(str);
}, false);
</script>

$("#myMenu > li").click(function (ev) {
  var str = $(this).html();
  showUser(str);
});