Question

我有一个应列出搜索结果的网站。用户应输入自行车名称按搜索。根据输入的名称按搜索后，我需要获取搜索结果并将其打印在我的搜索结果字段中。这是搜索地址示例搜索类型：http://api.citybik.es/idecycle.json。

有人帮忙怎么做？ http://jsfiddle.net/68w5xroL/

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
    <HEAD>
        <meta charset="utf-8" />
        <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" />
        <link rel="stylesheet" href="./css/style.css" />
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
        <script src="./script.js">
               </script>

            <script>

            function getList(value,l1){
                $.ajax({
                url: "http://api.citybik.es/"+value+".json",
                dataType: "jsonp",
                success: function (data) {                      
                    $.each(data.feed.entry, function (i,item) {
                        var title=item.bikes;
                        var timestamp=item.timestamp;
                        var free=item.free; 
                        $(l1).append("TITLE");                  
                    });
                },

            });
        }

            $(function(){
        var l1 = $('.results_list');
        //var u1="http://api.citybik.es/idecycle.json";

        var lista= [ "idecycle", "bicipalma" , "vlille" , "bicileon" , "decobike-miami-beach" ,  "decobike-long-beach" , "bikemi", "bizi" , "tigullionbike" , "portofino-park-and-bike" , "biella" , "ascoli-piceno" ,"arbike" , "bigi"  , "bici-in-busto"]; 
        $('.the_icons').hide();         
        $('.result_container').hide(); 
        $('#share_interface').hide(); 
        $('.email_insert').hide(); 
        $('#error').hide(); 

        $('#search').on('click', function () {
        var value=$("#searchTerm").val();
        $('.result_container').show(); 
        //$('.results_list').text(value);
        getList(value,l1);              
        //$('.results_list').append(im.attr('title'));

    });


    $( "#searchTerm" ).autocomplete({
      source: lista,
      minLength:0
        });

        $('#share_button').click(function(){
            $(this).addClass('active');
            $("#search_button").removeClass('active');
            $('.result_container').hide();
            $('#search_interface').hide();
            $('.email_insert').dialog("open");
            $('.the_icons').show();         
            $('#share_interface').show(); 
            //$('.email_insert').show(); 
        });

            $('.email_insert').dialog({
        autoOpen:false,
        modal:true,
        closeOnEscape: false,
    open: function(event, ui) { $(".ui-dialog-titlebar-close", ui.dialog || ui).hide();},
        buttons:{
    ok:function()
    {
        var pass1=$("#ins_email").val();

    if(IsEmail(pass1)){
    $('.email_insert').dialog("close");
    }
    else{ 
    $("#error").show();
        }
    }   
    }

    });

function IsEmail(email) {
  var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
  return regex.test(email);
}

             });

          </script> 

        <TITLE>City Bike Search Engine</TITLE>
    </HEAD>
    <BODY>
        <div class="container">
            <div class="nav_container">

                <div class="global_navigation">
                    <span class="global_nav_button active" id="search_button">Search Engine</span>
                    <span class="global_nav_button" id="share_button">Share</span>
                </div>

                <span id="search_interface">
                    <h1> Bike Search </h1>
                    <input type="text" id="searchTerm" />
                    <button id="search">Search</button>
                </span>
                <span id="share_interface">
                    <h1> Share Results </h1>
                    <div class="the_icons">
                        <ul class="social" id="selectable">

                            <li class="delicious ui-widget-content ">
                                <a href="http://www.delicious.com/"></a>
                            </li>
                            <li class="digg ui-widget-content">
                                <a href="http://digg.com/"></a>
                            </li>
                            <li class="facebook ui-widget-content">
                                <a href="http://www.facebook.com/"></a>
                            </li>
                            <li class="flickr ui-widget-content">
                                <a href="http://www.flickr.com/"></a>
                            </li>
                            <li class="linkedin ui-widget-content">
                                <a href="http://www.linkedin.com/"></a>
                            </li>
                            <li class="reddit ui-widget-content">
                                <a href="http://www.reddit.com/"></a>
                            </li>
                            <li class="rss ui-widget-content">
                                <a href="http://feeds2.feedburner.com/marcofolio"></a>
                            </li>


                    </ul>
                </div>
                <button id="share_dialog_call">SHARE</button>
            </span>
        </div>
    </div>
    <div class="result_container">
        <div class="results">
            <h2> Search results: </h2>
            <ul class="results_list">
            </ul>
        </div>
        <div class="favorites">
            <h2> Favorites: </h2>
            <ul class="favorites_list">
                <li class='listItem ui-state-default ui-sortable-handle ui-state-disabled'> <span> Fill me up! </span></li>
            </ul>
        </div>
    </div>


    <div class="email_insert" title="Insert your email">
        <span id="error"><b>Invalid email!<br/> eg. pero@doma.mk</b></span><br/>
        <span>Email: </span></br>
        <input type="text" id="ins_email"/>
    </div>

    <div class="share_dialog" title="Sharing options">


    </div>
<p id="la"></p>
</BODY>
</HTML>

Jquery将其他网站内容复制到我的网站

0 个答案: