Question

点击按钮后如何加载jQuery。到目前为止，它在页面加载时加载。我希望它在点击按钮后加载！我尝试了很多东西，到目前为止还没有工作，请帮忙...

到目前为止，这是我的代码

<a href="#image_link" title="PutLockerMedia" id="click">watch</a>
<div style="display:none">
  <div id="image_link">
    <div class="imageWrapper">
      <div class="image"> 
    <iframe src="http://www.putlocker.com/embed/E25FA20CE8643E5F" width="600" height="360" frameborder="0" scrolling="no"></iframe>
      </div>
    </div>
  </div>
</div>


<script type="text/javascript">
   $(document).ready(function(){
      $("#click").fancybox({'scrolling': 'no','titleShow': false,'onClosed':
         function(){$("#login_error").hide();}});
   });
</script>

Answer 1

如果你想在点击按钮上动态加载jQuery（如果你解释了“为什么”你想这样做会有帮助），那么你可以使用这样的函数加载它：

function loadScript(sScriptSrc, oCallback) {
    var oHead = document.getElementsByTagName('head')[0];
    var oScript = document.createElement('script');
    oScript.type = 'text/javascript';
    oScript.src = sScriptSrc;
    // most browsers
    oScript.onload = oCallback;
    // IE 6 & 7
    oScript.onreadystatechange = function() {
        if (this.readyState == 'complete') {
            oCallback();
        }
    }
    oHead.appendChild(oScript);
}

请注意，在加载AFTER之前，您的其他jQuery代码无法运行。您的代码可能如下所示：

<a href="#image_link" title="PutLockerMedia" id="click">watch</a>
<div style="display:none">
  <div id="image_link">
    <div class="imageWrapper">
      <div class="image"> 
    <iframe src="http://www.putlocker.com/embed/E25FA20CE8643E5F" width="600" height="360" frameborder="0" scrolling="no"></iframe>
      </div>
    </div>
  </div>
</div>


<script type="text/javascript">
function loadScript(sScriptSrc, oCallback) {
    var oHead = document.getElementsByTagName('head')[0];
    var oScript = document.createElement('script');
    oScript.type = 'text/javascript';
    oScript.src = sScriptSrc;
    // most browsers
    oScript.onload = oCallback;
    // IE 6 & 7
    oScript.onreadystatechange = function() {
        if (this.readyState == 'complete') {
            oCallback();
        }
    }
    oHead.appendChild(oScript);
}
function jQueryLoaded() {
      $("#click").fancybox({'scrolling': 'no','titleShow': false,'onClosed':
         function(){$("#login_error").hide();}});
   });
}

document.getElementById("myButton").addEventListener("click", function() {
    // load jQuery and when it's loaded, call jQueryLoaded
    loadScript("jquery.js", jQueryLoaded);
}, false);

</script>

其他参考答案：

How to know if JQuery has finished loading

Javascript multiple Dynamic Insertion

Answer 2

试试这个

<script type="text/javascript"> 
    $(document).ready(function(){ 
         $("#click").click(function fancybox(){
                          'scrolling': 'no',
                          'titleShow': false,
                          'onClosed': function(){
                                         $("#login_error").hide();
                                      }
         }); 
    }); 
</script>

如何在单击按钮时加载jQuery？

2 个答案: