单击按钮后如何调用JQuery函数？

Question

我有一个JQuery函数，该函数通过使用JSON文件来获取并显示一页图像。 我想在单击按钮时显示下一组图像，但是这需要在请求URL上添加一个短字符串，该字符串在我第一次运行脚本时会发现并存储在var中。 我需要再次调用此JQuery函数，并将字符串var传递给它（以下代码中的lastId）。 我通常对JavaScript完全陌生，并且不知道该怎么做。

这是代码的完整版本：

$(function runthis(un){
   var lastId;
   un = typeof un !== 'undefined' ? un : "";
  $('#domainform').on('submit', function(event){
    event.preventDefault();
    $('#content').html('<center><img src="img/loader.gif" alt="loading..."></center>');

    //var lastId;
    var domain = $('#s').val();
    var newdomain = domain.replace(/\//g, ''); // remove all slashes
    var requrl = "http://www.reddit.com/r/";
    var getmore;

    getmore = "?after=t3_"+un; 

    var fullurlll = requrl + domain + ".json" + getmore;

    $.getJSON(fullurlll, function(json){
      var listing = json.data.children;
      var html = '<ul class="linklist">\n';

      for(var i=0, l=listing.length; i<20; i++) {
        var obj = listing[i].data;

        var votes     = obj.score;
        var title     = obj.title;
        var subtime   = obj.created_utc;
        var thumb     = obj.thumbnail;
        var subrdt    = "/r/"+obj.subreddit;
        var redditurl = "http://www.reddit.com"+obj.permalink;
        var subrdturl = "http://www.reddit.com/r/"+obj.subreddit+"/";
        var exturl    = obj.url;
        var imgr      = exturl;
        var imgrlnk   = imgr.replace("target=%22_blank%22","");

        var length = 14;
        var myString = imgrlnk;
        var mycon = imgrlnk;
        var end = mycon.substring(0,14);
        myString.slice(-4);
        var test1 = myString.charAt(0);
        var test2 = myString.charAt(1);

        var timeago = timeSince(subtime);

        if(obj.thumbnail === 'default' || obj.thumbnail === 'nsfw' || obj.thumbnail === '')
          thumb = 'img/default-thumb.png';

        if(end == "http://i.imgur" ){  
          $("#MyEdit").html(exturl);
          html += '<li class="clearfix">\n';
          html += '<img src="'+imgrlnk+'" style="max-width:100%; max-height:750px;">\n';
          html += '</li>\n';
          html += '<div class="linkdetails"><h2><a href="'+imgrlnk+'" style="text-decoration: none; font-size:2em">'+title+'</a></h2>\n';
          /*html += '<p class="subrdt">posted to  <a href="'+subrdturl+'" target="_blank">'+subrdt+'</a> '+timeago+'</p>'; /*'+test1+test2+'*/
          html += '</div></li>\n';
        }

        if (listing && listing.length > 0) {
            lastId = listing[listing.length - 1].data.id;
        } else {
            lastId = undefined;
        }

      } // end for{} loop

      htmlOutput(html);

    }); // end getJSON()
  }); // end .on(submit) listener

  function htmlOutput(html) {
    html += '</ul>';

    $('#content').html(html);
  }   
});

Answer 1

您当前执行该函数的方式永远不会使您对该函数有所了解。 这意味着它仅真正存在于document.ready的上下文中（$（function（））是其快捷方式）。

您要做的是保留对此功能的引用，以供以后使用。

如果您希望将其直接放入onclick='' ，则需要将该函数放在全局位置，

例如：

var myFunction = function() { /*Stuff here*/}
$(myFunction)

这声明了一个名为myFunction的函数，然后告诉jQuery在文档就绪时执行它

全局编辑通常被认为是很顽皮的。 一种更好的选择是将点击分配给javascript中的按钮

例如：

$(function(){ 
   var myFunction = function() { /*Stuff here*/}
   myFunction(); //call it here
   $('#my-button-id').click(myFunction);//attach a click event to the button
)

这意味着函数myFunction仅存在于文档范围内，而不是全局范围内（根本不需要onclick='' ）

Answer 2

t要在某些事件上添加侦听器，可以像yhis一样使用live('click',function(){}) ：

<div id="my-button">some content</div>
<script type="text/javascript">
$('#my-button').live('click',function(){
//your code 
})
</script>