在叶节点上设置click事件

时间:2013-04-24 12:22:55

标签: javascript xslt

我有这种类型的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其最后一个孩子没有孩子,然后将其文本复制到div标签。
怎么可能...... 我认为它的工作与jquery功能点击。
谢谢...

2 个答案:

答案 0 :(得分:2)

听起来你需要修改HTML,不管怎么说试试这个:

Working Demo

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


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

答案 1 :(得分:1)

这将选择没有孩子的所有李。然后只需附加点击事件。 (假设有效的HTML)

$('li:not(:has(*))').click(.....)