0

我对 JQuery 和 Javascript 都很陌生。我有一个提要,我想将这些提要显示在可折叠 div 中作为可折叠 div。我有以下 Javascript 文件:

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript">
    google.load("feeds", "1");
    google.setOnLoadCallback(showFeed);

    function showFeed() {
      var feed = new google.feeds.Feed("http://www.varzesh3.com/rss");
      feed.setNumEntries(10);
      feed.load(function(result) {
        if (!result.error) {
          var container = document.getElementById("headlines");
          for (var i = 0; i < result.feed.entries.length; i++) {
            var entry = result.feed.entries[i];
            var di = document.createElement("div").setAttributeNode("data-role", "collapsible");
            di.innerHTML = '<h3>' + entry.title + '</h3>';
            di.innerHTML += '<p>' + entry.contentSnippet + '</p>';
            container.appendChild(di);
          }
        } else {
            var container = document.getElementById("headlines");
            container.innerHTML = '<li>Get your geek news fix at site</li>';
        }
      });
    }
</script>

<body>
    <div data-role="collapsible-set" id="headlines"></div> 
</body>

这应该获取我所有的提要名称并将它们放在一个可折叠的 div 中,它确实做到了,但它将名称显示为纯 HTML 文本而不是 JQuery Mobile 可折叠 div。

4

1 回答 1

0

@AML,这更像是评论而不是答案,因为不要分析您的整个代码,但我会放在这里以进行格式化。

在行中:

var di = document.createElement("div").setAttributeNode("data-role", "collapsible");

您不需要将指针(di)指向新创建的元素,而是获取 setAttributeNode(...)的结果,您需要将代码分成两行,如下所示:

var di = document.createElement("div");
di.setAttribute("data-role", "collapsible");

setAttributeNode 有一个问题其实就是 setAttribute。现在正在工作,请参阅http://pannonicaquartet.com/test/feeds.html

<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
<style type="text/css">
    .collapsible{
        display : none;
    }
    h3{
        background-color : lightgray;
    }
</style>
    <script src="https://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
    google.load("feeds", "1");

    function showFeed() {
      var feed = new google.feeds.Feed("http://www.varzesh3.com/rss");
      feed.load(function(result) {
        if (!result.error) {
          var container = document.getElementById("headlines");
          for (var i = 0; i < result.feed.entries.length; i++) {
            var entry = result.feed.entries[i];
            var div = document.createElement("div");
            div.onclick = function(evt){
                var elP = this.children[1];
                if(elP.style.display == 'inline'){
                   elP.style.display = 'none';
                }else{
                   elP.style.display = 'inline';
                }
            };
            div.innerHTML = '<h3>' + entry.title + '</h3>';
            div.innerHTML += '<p class="collapsible">' + entry.contentSnippet + '</p>';
            container.appendChild(div);
          }
        }
      });
    }

    google.setOnLoadCallback(showFeed);

</script>
于 2013-01-06T14:48:43.187 回答