jQuery自动分压器直到在过滤器框中输入内容才加载

jQuery autodividers don't load until something is typed in the filter box

本文关键字：输入 加载 过滤器 分压器 jQuery      更新时间：2023-09-26

我试图使一个网站与三个类别和一个过滤框通过它们进行搜索。我也试图使用字母自动分压器，然而，这些不加载，直到在过滤框中键入的东西。我也不能让jQuery在Chrome上工作。有办法让自动分割器工作吗?我想也许jQuery没有及时加载，但尝试了窗口。加载和没有乐趣，我还包括document.ready。这基本上就是我想做的，但这个人对我做了很多不同的事情。http://site320.webelevate.net/Jquery/

HTML:
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
        <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
        <script>
            $(document).ready( function() {
                $.getJSON("starTrek.json", function(data){
                    $.each(data.enterprise.humans, function(){
                        $("ul#humans").append('<li>' + '<a href="#' + this["url"] + '"">'+ this["firstName"] + ' ' + this["lastName"] + '</a>' + '</li>');
                    });
                    $.each(data.enterprise.robots, function(){
                        $("ul#robots").append('<li>' + '<a href="#' + this["url"] + '"">'+this["firstName"] + ' ' + this["lastName"] + '</a>' + '</li>');
                    });
                    $.each(data.enterprise.wesley, function(){
                        $("ul#wesley").append('<li>' + '<a href="#' + this["url"] + '"">'+ this["firstName"] + ' ' + this["lastName"] + '</a>' + '</li>');
                    });
                });
            });
        </script>
    </head>
    <body>
        <div data-role="page" id="home"> 
            <div data-role="header">
                <h1>Star Trek: The Next Generation</h1>
            </div><!-- /header -->
                <div data-role="collapsible">
                <h2>Humans</h2>
                    <ul id="humans" data-role="listview"  data-filter="true" data-icon="user" data-autodividers="true">
                    </ul>
                </div>
                <div data-role="collapsible">
                <h2>Robots</h2>
                    <ul id="robots" data-role="listview"  data-filter="true" data-icon="gear" data-autodividers="true"> 
                    </ul>
                </div>
                <div data-role="collapsible">
                <h2>Wesley</h2>
                    <ul id="wesley" data-role="listview"  data-filter="true" data-icon="forbidden" data-autodividers="true">
                    </ul>
                </div>
            </ul>
        </div>
        <div data-role="page" id="picard"> 
            <p>Jean-Luc Picard was a celebrated Starfleet officer, archaeologist and diplomat who served during the latter two thirds of the 24th century. The highlights of his career were centered around assignments as commanding officer of the Federation starships: USS Stargazer, USS Enterprise-D, and the USS Enterprise-E. In these roles, Picard not only witnessed the major turning points of recent galactic history, but played a key role in them also, from making first contact as captain of the Federation's flagship with no fewer than 27 alien species, including the Ferengi and the Borg. He also became the chief contact point with the Q Continuum, and served as Arbiter of Succession, where he presided over the investiture of Chancellor Gowron.</p>
        </div>
        <div data-role="page" id="riker"> 
            <p>William Thomas Riker was a noted Starfleet officer, perhaps best known for his long assignment as first officer under Captain Jean-Luc Picard aboard the USS Enterprise-D, and later the USS Enterprise-E. In 2379, he finally accepted a promotion as captain of the USS Titan. In 2361, a transporter accident resulted in two Rikers, with each one being identical to the other, as well as genetically indistinguishable. Their personality and memories were the same up to the point of the duplication. The other Riker eventually decided to use his middle name and became known as Thomas Riker.</p>
        </div>
        <div data-role="page" id="worf"> 
            <!-- I'm only on season 4 of DS9, this just totally spoilered me. -->
            <p>Worf – son of Mogh, of the Klingon House of Martok, of the Human family Rozhenko; mate to K'Ehleyr, father to Alexander Rozhenko, and husband to Jadzia Dax; Starfleet officer and soldier of the Empire; bane of the House of Duras; slayer of Gowron; Federation ambassador to Qo'noS – was one of the most influential Klingons of the latter half of the 24th century. </p>
        </div>
        <div data-role="page" id="data">
            <p>Lieutenant Commander Data was a Soong-type android, the first and only such being to ever enter Starfleet. Data was created some time in the 2330s and was destroyed in 2379, sacrificing himself to save the crew of the USS Enterprise-E. </p>
        </div>
        <div data-role="page" id="crusher">
            <p>Commander Beverly Cheryl Crusher, MD, (née Howard) was the chief medical officer aboard the USS Enterprise-D and its successor, the USS Enterprise-E, both under the command of Captain Jean-Luc Picard. She briefly left her post as CMO of the Enterprise-D to become head of Starfleet Medical, only to return shortly after. She was a Fellow of the Academy of Starfleet Surgeons.</p>
        </div>
        <div data-role="page" id="troi">
            <p>Deanna Troi was a half-Betazoid, half-Human Starfleet officer. Under the command of Captain Jean-Luc Picard, she served as ship's counselor aboard the USS Enterprise-D and the USS Enterprise-E. In 2379, Troi transferred to the USS Titan. As a half-Betazoid, Troi was capable of extra-sensory empathy, but was incapable of reading aliens with brain structures dissimilar to Humans and other Betazoids, such as the Breen and the Ferengi. Like most Betazoids, Troi had telepathic abilities. Due to her half-Human heritage, however, the range of her telepathic abilities was limited compared to full-blooded Betazoids, and she could usually only read the thoughts of other Betazoids, most notably her mother. Troi's empathic skills made her an important asset to the Enterprise-D and her abilities were often particularly useful when dealing with hostile races. Since she could usually determine using her abilities whether others were lying, she repeatedly proved herself invaluable in many suspenseful situations.</p>
        </div>
        <div data-role="page" id="obrien"> 
            <p>Miles Edward O'Brien was a 24th century Human Starfleet non-commissioned officer who, following his service during the Federation-Cardassian War, served as transporter chief on board the USS Enterprise-D for several years before being promoted to chief of operations aboard starbase Deep Space 9. After the Dominion War, he accepted a teaching position at Starfleet Academy on Earth.</p>
        </div>
        <div data-role="page" id="wesley"> 
            <p>When Wesley was only five years old, his father, Jack Crusher, was killed while on duty on the USS Stargazer under the command of Captain Jean-Luc Picard. Ten years later, fifteen-year-old Wesley found himself living aboard the starship USS Enterprise-D when his mother, Doctor Beverly Crusher became Captain Picard's chief medical officer aboard the ship. Wesley often was a challenge and sore sight in the captain's eyes, because of the captain's disdain for children, although Wesley's astuteness and knowledge of engineering, as well as top grades on scientific examinations continuously impressed Picard. These same characteristics were, in part, the cause of Wesley suffering from loneliness early on, as his peers were intimidated by his bright mind – he also showed a tendency to take his duties almost too seriously.</p>
    </body>
</html>
JSON: 

    {
    "enterprise": {
        "humans": [
        { "firstName":"Jean Luc" , "lastName":"Picard" , "url":"picard"}, 
        { "firstName":"Will" , "lastName":"Riker" , "url":"riker"},
        { "firstName":"Mr" , "lastName":"Worf" , "url":"worf"},
        { "firstName":"Beverly" , "lastName":"Crusher" , "url":"crusher"},
        { "firstName":"Deanna" , "lastName":"Troi" , "url":"troi" },
        { "firstName":"Miles" , "lastName":"O'Brien" , "url":"obrien"}
        ],
    "robots": [
        { "firstName":"Data" , "lastName":" " , "url":"data"}
        ],
    "wesley": [
        { "firstName":"Shut up" , "lastName":"Wesley" , "url":"wesley"}
        ]
    }
}

强制Javascript重新加载修复。

<script>
    $(document).ready( function() {
        $.getJSON("starTrek.json", function(data){
            $.each(data.enterprise.humans, function(){
                $("ul#humans").append('<li>' + '<a href="#' + this["url"] + '"">'+ this["firstName"] + ' ' + this["lastName"] + '</a>' + '</li>');
                $("ul#[humans]").refresh;
        });
            $.each(data.enterprise.robots, function(){
                $("ul#robots").append('<li>' + '<a href="#' + this["url"] + '"">'+this["firstName"] + ' ' + this["lastName"] + '</a>' + '</li>');
                $("ul#[robots]").refresh;
        });
            $.each(data.enterprise.wesley, function(){
                $("ul#wesley").append('<li>' + '<a href="#' + this["url"] + '"">'+ this["firstName"] + ' ' + this["lastName"] + '</a>' + '</li>');
                $("ul#[wesley]").refresh;
                });
            });
        });
</script>
相关文章：