Question

我直接在html文件中编写脚本，它添加了一些分页功能，并且它在HTML文件中工作得很好，但我不知道如何将此脚本传输到外部js文件并使其从那里运行。所以hres部分：

<form id="moredisplay" method="get" style="display:inline;">
            <input class="hiddeninteger" type="hidden" name="loadmore" value="">
            <!--LIMIT CHANGER-->
            <input type="checkbox" title="" id="limitcheck" name="limit" value="<?php echo $vsego;?>" style="display:none;">
            <input type="checkbox" title="" id="skipforfcheck" name="skip_items" value="" style="display:none;">
            <input type="checkbox" title="" id="skipbackcheck" name="skip_items" value="" style="display:none;">
            <button type="submit" title="back" value="" id="rerurn_more_items"/>back</button>
            <button type="submit" title="next" value="" id="skip_more_items"/>fowards</button>
            <button type="submit" title="more content" value="<?php echo $vsego;?>" id="limit" name="limit" onclick=""/>more content</button>
            <script>
                var currentval = jQuery('.scippeditems').attr('value');
                jQuery('#skip_items,#rerurn_items').attr('value',currentval);
                var valuenumber = jQuery('#skip_items').val();
                if (valuenumber == 0){
                jQuery('#rerurn_items').attr('disabled', 'disabled').css({'opacity':'0.6'});
                }
                var itemsshow = jQuery('#limit').val();
                var pagescount = (jQuery('#skip_items').attr('value'))/(jQuery('#limit').attr('value'));
                if(pagescount >=5){jQuery('#skip_items, #limit').attr('disabled', 'disabled').css({'opacity':'0.6'});}//COUNT PAGES AND LOCK NEXT
                function changepageforf(){
                var elem = document.getElementById("skip_items");
                var currentval = elem.value;
                elem.value = parseInt(currentval) + 24;}//parseInt(itemsshow);}
                function changepageback(){
                var elem = document.getElementById("rerurn_items");
                var currentval = elem.value;
                elem.value = parseInt(currentval) - 24;}//parseInt(itemsshow);}
                </script>
                <script>
                jQuery(document).ready(function(){
                jQuery('#limit').click(changelimit);//RUN FUNCTION ON LIMIT CHANGE
                if ( document.location.href.indexOf('&limit') > -1 ) {//IF URL CONTAINS LINES LIMIT
                jQuery('#rerurn_items, #skip_items').hide()//HIDE PAGINATION
                jQuery('#rerurn_more_items, #skip_more_items').show()//SHOW LIMIT PAGINATION
                var checkval = jQuery('#limitcheck').attr('value');
                var currentvalskip = jQuery('.scippeditems').attr('value');
                jQuery('#skipforfcheck').attr('value', (parseInt(checkval)+parseInt(currentvalskip)));//NEXT BTN VALUE
                var currentforfaction = jQuery('#skipforfcheck').attr('value')
                jQuery('#skipbackcheck').attr('value',Math.ceil( ( (parseInt(currentforfaction)-parseInt(checkval) ) - parseInt(checkval) ) ) );//PREV BTN VALUE
                var pagescount = (jQuery('#skipforfcheck').attr('value'))/(jQuery('#limitcheck').attr('value'));
                if(pagescount >=5){jQuery('#skip_more_items, #limit').attr('disabled', 'disabled').css({'opacity':'0.6'});}//COUNT PAGES AND LOCK NEXT
                if( jQuery('#skipbackcheck').attr('value') <= 0 ){ jQuery('#skipbackcheck').attr('value', 0 );}//RETURN 0 AS A VALUE IF NEGATIVE
                jQuery('#skip_more_items').click(function(){//SUBMIT NEXT BTN
                    jQuery('#limitcheck').attr('checked', true);
                    jQuery('#skipforfcheck').attr('checked', true);
                    jQuery('#moredisplay').submit()
                });
                jQuery('#rerurn_more_items').click(function(){//SUBMIT PREV BTN
                    jQuery('#limitcheck').attr('checked', true);
                    jQuery('#skipbackcheck').attr('checked', true);
                    jQuery('#moredisplay').submit()
                });
                }
                function changelimit(){//LIMIT INCREASE STEP
                var elem = document.getElementById("limit");
                var currentval = elem.value;
                elem.value = parseInt(currentval) + 6;}//HOW MUCH
                var valuenumber = jQuery('#skip_items').val();
                if (valuenumber == 0){//HIDE PREV BTN IF NO PREV
                jQuery('#rerurn_more_items').attr('disabled', 'disabled').css({'opacity':'0.6'});
                }
                });
            </script>
    </form>

我做了什么尝试：复制脚本并输入pagination.js文件并在页面顶部调用脚本

$document =& JFactory::getDocument();
$document->addScript("jquery/pagination.js");

但这不起作用...我是jQuery的新手，所以请不要抨击我，如果我只是愚蠢：L）

Answer 1

您需要将代码包装在：

$(document).ready( function() {
    // your code here 
});

Answer 2

Aspiring Aqib指出，你需要用

启动你的JQuery脚本

$(document).ready( function() {
    // your code here 
});

或

$(function() {
    // your code here 
});

这基本上是说'等到DOM完全创建后再执行该函数内的脚本。

Answer 3

Aspiring Aqib和Dave都是关于将jQuery代码包装在$(function(){//code goes here});块中的。

然而，一个更常见的错误是没有以正确的顺序加载jQuery库文件和您自己的.js文件，这可能很难找到，因为编辑器或浏览器中没有任何警告。 jQuery库必须位于所有自己的.js文件之前。

将jQuery脚本传输到外部文件

3 个答案: