Question

列出项目

 i want a javascript that can access the button elements inside   
  the
 dot.append() function. so that when i clicked the button i 
 get the value of that  button.
 below is a piece of code that have been working on this morning.
  i appreciate any support or hint from anyone.Thank you in 
 advance.
 further more i am also new in youtube data api.

   



    function main_search(){
	 $("form").on("submit",function(e){
		 e.preventDefault();
		 //after that we prepare the request
		 var myRequest = gapi.client.youtube.search.list({
			part: 'snippet',
	q: encodeURIComponent($("#query").val()).replace(/%20/g, "+"),
           	maxResults :5,
            type : 'video'			
		 });
		  //  then we execute the request
		   myRequest.execute(function(response){
		     var results = response.result;
			 $.each(results.items, function(index,item){


	$("#results").append('<li>'+item.id.videoId+" "+item.snippet.title+"

     "+item.snippet.channelTitle+" "+item.snippet.description+" 
 
     "+item.snippet.publishedAt+" "+'<img 
                                                                                 src="'+item.snippet.thumbnails.high.url+'">'+'<button 
    class="class_btns" value="'+item.id.videoId+'">'+'get video url
    '+'</buttons>'+'</li>'+"<br>");
			 });
			 
		 });
  });
  }

function loadAPI(){
	gapi.client.setApiKey("AIzaSyC1CJHONRDvyfSS3xAOG9SfW_VCXMoLK5Y");
	gapi.client.load("youtube","v3", function(){
		//my youtube api is read
		main_search();
	});
    }

  
 <form action="#">
 <input type="search" id="search_string"   placeholder="Your string 
 goes  
  here...."></input>

 <input type="submit" name="search-btn" id="search_btn" value="search">
 </input>
 </form>

	<ul id="result_box"></ul>
	
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1
/jquery.min.js"></script>

    <script src="search.js"></script>

Answer 1

只需将您的陈述分成两行，以便以后可以访问该元素：

var element = document.createElement('<li>'+item.id.videoId+" "+item.snippet.title+"

     "+item.snippet.channelTitle+" "+item.snippet.description+" 

     "+item.snippet.publishedAt+" "+'<img 
                                                                                 src="'+item.snippet.thumbnails.high.url+'">'+'<button 
    class="class_btns" value="'+item.id.videoId+'">'+'get video url
    '+'</buttons>'+'</li>'+"<br>");

$("#results").append(element);

或者如果你想要一个jQuery对象：

var element = $('<li>'+item.id.videoId+" "+item.snippet.title+"

     "+item.snippet.channelTitle+" "+item.snippet.description+" 

     "+item.snippet.publishedAt+" "+'<img 
                                                                                 src="'+item.snippet.thumbnails.high.url+'">'+'<button 
    class="class_btns" value="'+item.id.videoId+'">'+'get video url
    '+'</buttons>'+'</li>'+"<br>");

然后，您可以从element变量中访问您想要的任何内容。

或者，如果保留当前代码，可以稍后使用该类抓取按钮：

var button = $('.class_btns');

可以访问变量中声明的元素的javascript

1 个答案: