번호 매기기 클래스를 반복하고 단축 URL을 추가하십시오.

Question

URL을 줄이고 URL 태그를 단축 태그로 삽입하려면 약간의 스크립트를 사용하고 있습니다.

jquery를 사용하면 다음 목록 ID를 반복하고 긴 URL을 단축 된 URL로 바꿀 수 있습니다.

<ul class="vertical-list list-parent"> 
    <li id="license_key_0"> 
     <div class="primary two-quarter unit-link"> 
      <span>http://localhost:3000/projects/313f7f5586b39cd9bf7a894894564036</span> 
     </div> 
    </li> 
    <li id="license_key_1"> 
    <div class="primary two-quarter unit-link"> 
     <span>http://localhost:3000/projects/287a990d17b680fe410329cb95af89b9</span> 
    </div> 
    </li> 
<li id="license_key_2"> 
    <div class="primary two-quarter unit-link"> 
     <span>http://localhost:3000/projects/ff381cdb94070e1903c5f6fddc31b148</span> 
    </div> 
</li> 
    </ul> 

JQuery와 :

(function ($j) { 
     function get_short_url(long_url, login, api_key, func) { 
     $j.getJSON(
      "http://api.bitly.com/v3/shorten?callback=?", { 
      "format": "json", 
      "apiKey": api_key, 
      "login": login, 
      "longUrl": long_url 
     }, 
     function (response) { 
      func(response.data.url); 
     }); 
     } 

     var login = "my_login"; 
     var api_key = "my_api_key"; 
     var long_url = "m"; 

     get_short_url(long_url, login, api_key, function (short_url) { 
     console.log(short_url); 
     }); 

    })(jQuery); 

Answer 1

사용 .each() JQuery와 기능은 선택을 반복합니다 :

$('ul .unit-link span').each(
    function(index){ 
     var long_url = $(this).text(); 
     get_short_url(long_url, login, api_key, function (short_url) { 
      console.log(short_url); 
     }); 
    }); 

Answer 2

시험이 :

당신은 dataType: "jsonp"와 .ajax를 사용할 필요가

(function ($) { 
    function get_short_url(long_url, login, api_key, func) { 
     $.getJSON(
      "http://api.bitly.com/v3/shorten?callback=?", { 
      "format": "json", 
      "apiKey": api_key, 
      "login": login, 
      "longUrl": long_url 
     }, 
     function (response) { 
      func(response.data.url); 
     }); 
    } 

    var login = "my_login"; 
    var api_key = "my_api_key"; 

    $("ul.list-parent li").each(function() 
           { 
            var long_url = $(this).find("span").text(); 

            get_short_url(long_url, login, api_key, function (short_url) { 
               console.log(short_url); 
               }); 
           } 
           ); 


})(jQuery); 

Answer 3

$j.each($j("li div.primary"), function() { 
    var long_url = $j(this).find("span").html(); 

    get_short_url(long_url, login, api_key, 
     function(short_url) { console.log(short_url) } 
    ); 
}); 

Answer 4

. 반복하려면 다음과 같이 .each을 사용하십시오 : http://jsfiddle.net/37Zv4/.

(function ($j) { 
    function get_short_url(long_url, login, api_key, func) { 
     $j.ajax({ 
     url: "http://api.bitly.com/v3/shorten", 
     data: { 
      "format": "json", 
      "apiKey": api_key, 
      "login": login, 
      "longUrl": long_url 
     }, 
     dataType: "jsonp", 
     success: function (response) { 
      func(response.data.url); 
     } 
    }); 
    } 

    var login = "bitlyapioauthdemo"; 
    var api_key = "R_f6397a37e765574f2e198dba5bb59522"; 

    $(".unit-link span").each(function() { 
     var $this = $(this); 
     get_short_url($this.text(), login, api_key, function (short_url) { 
     $this.text(short_url); 
     }); 
    }); 

})(jQuery);