html 和 js 工作問題總結(持續更新)

做爲一個不是寫前端代碼的人…
卻要寫前端代碼…難免會遇到許多的問題…

問題記錄如下

freemarker 數字輸出中的逗號問題

Long i=100000000l;
Map model=new Map();
model.put("t",i);
在freemarker中顯示爲100,000,000	
想按原樣輸出時${t} 顯示爲100,000,000	
${t?c} 顯示爲100000000
如果不加?c 默認情況下freemarker會將數字用逗號分隔
如何去掉","逗號呢.,加上"?c"就可以了。

當穿精度比較高的類型，傳字符串到前端
如果還還不能顯示,我們要在前端代碼里加' ',引號...
如:
<#if ruleList??>
        <#list ruleList as item>
            tableList.push({"t":'${((item.clearRuleNo)?c)!''}',"x":${item.clearRuleName}});
        </#list>
    </#if>

js獲取html對的值

// 獲取select的值
var v = $("#myselect option:selected").val()
var t = $("#myselect option:selected").text()

如何根據js動態設置select下拉框的值

    // 設置選中值(下拉列表的id,下拉列表要選中    的值)
    function set_select_checked(selectId, checkValue){
        var select = document.getElementById(selectId);
        for (var i = 0; i < select.options.length; i++){
            if (select.options[i].value == checkValue){
                select.options[i].selected = true;
                break;
            }
        }
    }
    var loadData = function(){
        var rate = '${bean.taxRateType?if_exists}'
        var type = '${bean.taxRateType?if_exists}'
        set_select_checked('taxRateType',rate)
        set_select_checked('anchorType',type)
    }
    loadData()

js動態加載select數據源

var loadData = function () {
        $.ajax({
            url: "/ggg/ttt/list?limit=99999999"
            , method: 'GET'
            ,async:false
            , contentType : 'application/json'
            ,success : function(msg){
                var data = msg.data
                console.log(data)
                var programme_sel=[];
                programme_sel.push('<option value="" selected>規則組名</option>')
                for(var i=0,len=data.length;i<len;i++){
                    var programme = data[i];
                    programme_sel.push('<option value="'+programme.value+'">'+programme.name+'</option>')
                }
                console.log(programme_sel)
                $("#clearRuleSetNoSelect").html(programme_sel.join(' '));
                layui.form.render();
            }
        })
    }

[HTML]顯示/隱藏DIV的技巧(visibility與display的差別)

div的visibility可以控制div的顯示和隱藏，但是隱藏後頁面顯示空白:
style="visibility: none;"　　
document.getElementById("typediv1").style.visibility="hidden";//隱藏　　
document.getElementById("typediv1").style.visibility="visible";//顯示

 
　　
　　　　
style="display: none;"　　
document.getElementById("typediv1").style.display="none"/隱藏
document.getElementById("typediv1").style.display="";//顯

// 切換div隱藏顯示
var changeHidden = function(divId){
	var value = document.getElementById(divId).style.display
	document.getElementById(divId).style.display = value=="none"?"":"none"
}
changeHidden("mydiv")

js解決json精度丟失問題

//主入口
function getRealJsonData(baseStr) {
    if (!baseStr || typeof baseStr != 'string') return;
    var jsonData = null;
    try {
        jsonData = JSON.parse(baseStr);
    } catch (err){
        return null;
    }
    var needReplaceStrs = [];
    loopFindArrOrObj(jsonData,needReplaceStrs);
    needReplaceStrs.forEach(function (replaceInfo) {
        var matchArr = baseStr.match(eval('/"'+ replaceInfo.key + '":[0-9]{15,}/'));
        if (matchArr) {
            var str = matchArr[0];
            var replaceStr = str.replace('"' + replaceInfo.key + '":','"' + replaceInfo.key + '":"');
            replaceStr += '"';
            baseStr = baseStr.replace(str,replaceStr);
        }
    });
    var returnJson = null;
    try {
        returnJson = JSON.parse(baseStr);
    }catch (err){
        return null;
    }
    return returnJson;
}

//遍歷對象類型的
function getNeedRpStrByObj(obj,needReplaceStrs) {
    for (var key in obj) {
        var value = obj[key];
        if (typeof value == 'number' && value > 9007199254740992){
            needReplaceStrs.push({key:key});
        }
        loopFindArrOrObj(value,needReplaceStrs);
    }
}

//遍歷數組類型的
function getNeedRpStrByArr(arr,needReplaceStrs) {
    for(var i=0; i<arr.length; i++){
        var value = arr[i];
        loopFindArrOrObj(value,needReplaceStrs);
    }
}

//遞歸遍歷
function loopFindArrOrObj(value,needRpStrArr) {
    var valueTypeof = Object.prototype.toString.call(value);
    if (valueTypeof == '[object Object]') {
        needRpStrArr.concat(getNeedRpStrByObj(value,needRpStrArr));
    }
    if (valueTypeof == '[object Array]') {
        needRpStrArr.concat(getNeedRpStrByArr(value,needRpStrArr));
    }
}

//使用：
var testString = '{"a":{"b":{"n":[{"a":"138476506","ad":"us","se":"測",' + 
'"e":"0","r":"0.0","s":"1","t":"2","c":"0","id1":35267723951111111111111111111111167885445,' + 
'"id2":472667239127885446}]},"q":"52"}}';
var data = getRealJsonData(testString);//直接放要解析的json字符串
var t = JSON.stringify(data, null,2);
console.log(t);