javascript - 在叶子节点上设置点击事件

我有这种类型的 html :-

<ul>
  <li>Activities<ul>
      <li>Physical1<ul>
          <li>Cricket<ul>
              <li>One Day</li>
            </ul>
          </li>
        </ul>
      </li>
      <li>Test1<ul>
          <li>Test At Abc</li>
        </ul>
      </li>
      <li>Test2<ul>
          <li>Test At Xyz</li>
        </ul>
      </li>
    </ul>
  </li>
</ul>
<br>

这是我加载 xml 文件和 xslt 的完整代码。并使用xslt获取ul li列表。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>

    <title>Untitled Page</title>
    <script>
        var xml = loadXMLDoc("abc.xml");
        var xsl = loadXMLDoc("a.xsl");

        function loadXMLDocActiveX(location) {
            var doc = new ActiveXObject("MSXML2.FreeThreadedDOMDocument");
            doc.async = false;
            doc.load(location);
            return doc;
        }

        function loadXMLDocOther(location) {
            xhttp = new XMLHttpRequest();
            xhttp.open("GET", location, false);
            xhttp.send("");
            return xhttp.responseXML;
        }

        function loadXMLDoc(dname) {
            if (window.ActiveXObject) {
                return loadXMLDocActiveX(dname);
            }
            else if (window.XMLHttpRequest) {
                return loadXMLDocOther(dname);
            }
        }

        function transformActiveX(xml, xsl, target, selected) {
            var transform = new ActiveXObject("MSXML2.XSLTemplate");
            transform.stylesheet = xsl;
            var processor = transform.createProcessor();
            processor.input = xml;

            if (selected) {
                processor.addParameter("selected", selected);
            }

            processor.transform();
            target.innerHTML = processor.output;
        }

        function transformOther(xml, xsl, target, selected) {
            var xsltProcessor = new XSLTProcessor();
            xsltProcessor.importStylesheet(xsl);

            if (selected) {
                xsltProcessor.setParameter(null, "selected", selected);
            }

            var resultDocument = xsltProcessor.transformToFragment(xml, document);
            target.innerHTML = "";
            target.appendChild(resultDocument);
        }

        function displayResult() {
            var targetElement = document.getElementById("load");

            // code for IE
            if (window.ActiveXObject) {
                transformActiveX(xml, xsl, targetElement);
            }
            // code for Mozilla, Firefox, Opera, etc.
            else if (document.implementation && 
                     document.implementation.createDocument) {
                transformOther(xml, xsl, targetElement);
            }
        }
    </script>
</head>
<body onload="displayResult()">
    <div id="load">
    </div>
</body>
</html>

我想设置单击叶节点，当单击叶节点时，其文本设置在我的中 <div id="result"/> 例如:- 点击One Day它的最后一个 child 没有 child ，然后将其文本复制到 div标签。
怎么可能…… 我认为它与 jquery 函数 click 一起工作。
谢谢...

最佳答案

听起来你需要修改 HTML，无论如何试试这个:

Working Demo

$('li:not(:has(*))').click(function(){
     $('#result').text($(this).text());
});


<div id="result"></div>

关于javascript - 在叶子节点上设置点击事件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16191951/

javascript - 在叶子节点上设置点击事件

上一篇：javascript - 如何在输入字段中放置默认文本，同时保留 JS 表单验证功能

下一篇：javascript - 如何使用 div 单击事件更新输入