一、JS常用小知识点

里面涉及到js中的一些小知识点：
1.命名空间的使用
问题：为什么要自定义命名空间？
原因：通用方法一般会被很多页面调用，所以有时候不可避免，页面当中存在的函数名和我们自定义的通用函数是重名的。这样就带来一个问题，页面不知道要去调用哪一个函数。所以我们需要在函数名前加一个命名空间，避免出现上述问题。

<script type="text/javascript">
    /**
     * window.common || {}
     * 若有js插件的命名空间也叫common，则就用这个命名；否则，创一个common命名空间
     * 问题：为什么要这么设置？
     * 原因：这样就避免了引入这个js文件的项目存在相同的方法名，导致不知道到底应该调用哪个方法！
     */
    var common = window.common || {};
    common.transferCurrentPage = function (currentPage) {
       ....
    }
</script>

2.函数的回调
问题：函数的回调是什么意思？
原因：见下面代码分析
使用方法：eval("${jsMethodName}(currentPage)"); 其中，“jsMethodName”（函数名）是标签的属性，由调用者提供，并且得提供函数的实现体；“currentPage”是函数的参数，由标签中提供。

common.transferCurrentPage = function (currentPage) {
        var rule = /^[0-9]*[1-9][0-9]*$/;
        if (!rule.test(currentPage)){
            currentPage = 1;
        }
//        $("#currentPage").val(currentPage);
//        $("#mainForm").submit();
        /**
         * $("#currentPage").val(currentPage);
         * $("#mainForm").submit();
         * 问题1：若有的跳转页面控件（"<input/>"）的id不是“currentPage”（id="currentPage"）怎么办？
         * 问题2：若请求方式是通过“ajax”异步请求，而不是通过form表单（$("#mainForm").submit()专用于form表单提交数据）怎么办？
         *
         * 问题解析：
         *     上述两个问题出现的原因是，我们不该把“设置控件的值”和“表单提交”设置死，而是由调用者来写这两部分逻辑，
         * 然后根据“调用者传过来的方法名”来调用“调用者写的这部分处理逻辑”
         *     重点：1、调用者写这部分逻辑；2、这里根据“函数名”和“这里处理好的参数”调用“调用者写的这部分逻辑”
         *     样例：“eval("${jsMethodName}(currentPage)")” 注意书写方式
         */
        eval("${jsMethodName}(currentPage)");
    }

3.标签中的控件id与调用页面的控件id冲突问题？
问题：标签中的控件id与调用页面的控件id冲突问题？
原因：很难保证标签中的控件id和调用页面的控件id不重复，一旦重复就会报错。
解决办法：在标签中设置一个属性，让调用页面通过这个属性传一个前缀过来，然后与控件id进行组合

<!-- 设置自定义属性：来接收使用这个标签传进来的前缀参数（防止控件名重复） -->
<%@ attribute type="java.lang.String" name="prefix" required="true" %>

跳至&nbsp;<input id=${prefix}+"currentPageText" value="1" class="allInput w28" type="text"/>&nbsp;页&nbsp;
    <a href="javascript:common.transferCurrentPage($('#' +${prefix} + 'currentPageText').val());" class="go">GO</a>

一、JS常用小知识点

猜你喜欢