2

これは私のxmlファイルです：-

<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="final.xsl"?>  
  <root>
    <child1 entity_id = "1" value= "Asia">
        <child2 entity_id = "2" value = "india">
            <child3 entity_id = "3" value = "Gujarat">
                <child5 entity_id = "5" value ="Rajkot"></child5>
            </child3>
            <child4 entity_id = "4" value = "Rajshthan">
                <child6 entity_id = "6" value = "Ajmer"></child6>
            </child4>
        </child2>
    </child1>
    </root>

これは私のXSLTファイルです：-

<xsl:template match="*">
    <xsl:for-each select="//child2">
    <xsl:value-of select="*"/>
    <xsl:value-of select="@value" />    
</xsl:for-each>

これは私のhtmlコードです：-

<script>
function loadXMLDoc(dname)
{
    if (window.XMLHttpRequest)
    {
        xhttp=new XMLHttpRequest();
    }
    else
    {
        xhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xhttp.open("GET",dname,false);
    xhttp.send("");
    return xhttp.responseXML;
}

function displayResult()
{
    xml=loadXMLDoc("final.xml");
    xsl=loadXMLDoc("books05.xsl");
    // code for IE
    if (window.ActiveXObject)
    {
        xml.addParameter("rss", test); 
        ex=xml.transformNode(xsl);
        document.getElementById("load").innerHTML=ex;
    }
    // code for Mozilla, Firefox, Opera, etc.
    else if (document.implementation && document.implementation.createDocument)
    {
        xsltProcessor=new XSLTProcessor();
        xsltProcessor.importStylesheet(xsl);
        resultDocument = xsltProcessor.transformToFragment(xml,document);
        document.getElementById("load").appendChild(resultDocument);
    }
}
</script>
<body onload="displayResult()">
<div id="load" />
</body>

出力は次のとおりです：-

India

今、私はインドでクリックイベントを設定したいです...インドをクリックしてからその表示グジャラートとラジシュタンのような子要素...グジャラートとラジシュタンを表示するときにインドを非表示にします...

4

1 に答える 1

1

これは機能するはずです。まず、XSLTを次のように定義できます。

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:output method="html" indent="yes" omit-xml-declaration="yes"/>
  <xsl:param name="selected" />

  <xsl:template match="/*" priority="2">
    <xsl:apply-templates select="*[not($selected)] | //*[@entity_id = $selected]/*" />
  </xsl:template>

  <xsl:template match="*[*]">
    <span onclick="displayResult('{@entity_id}');">
      <xsl:call-template name="ItemText" />
    </span>
  </xsl:template>

  <xsl:template match="*" name="ItemText">
    <xsl:value-of select="concat(@value, '&#xA0;')"/>
  </xsl:template>
</xsl:stylesheet>

パラメータなしで実行すると、トップレベルのアイテムのリストが生成され、onclickハンドラーを使用して独自のJavaScript関数を呼び出しますentity_id。

<span onclick="displayResult('1');">Asia </span>

entity_idまた、パラメータの値としてを使用して実行すると、selectedそのエンティティIDを持つアイテムの子のリストが返されます。

<span onclick="displayResult('3');">Gujarat </span>
<span onclick="displayResult('4');">Rajshthan </span>

次に、次のようにHTMLページを記述できます。

<!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("final.xml");
        var xsl = loadXMLDoc("books05.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(selected) {
            var targetElement = document.getElementById("load");

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

displayResult()関数にパラメーターがあり、このパラメーターに値がある場合、この値をXSLTパラメーターとしてXSLTに渡します。

それでいいはずです！

于 2013-02-09T15:19:32.640 に答える