目錄

1.自定義jstl標籤

問題描述：

1.1 編寫tld檔案

1.2 配置web.xml

1.3 具體使用

2.html的自定義屬性

問題描述

2.1 任意自定義

2.2 繫結物件

1.自定義jstl標籤

問題描述：

在使用jsp進行開發的時候，jstl標籤的使用可以極大的提升開發效率。有一個需求是需要在<c:forEach>中對每一個迴圈的結果記錄進行java物件轉換成json字串。然後將字串複製給一個a標籤的自定義屬性上，然後再在js中獲取並操作。這個物件是一個java物件，不能直接在js中操作，也無法通過JSON.stringify進行轉換，因為目標引數要求的是js物件。這種情況下，我們就可以使用自定義jstl標籤。我們的目標是將物件轉換成json字串。

1.1 編寫tld檔案

檔名為：mobai-el-common.tld

<?xml version="1.0" encoding="UTF-8"?>
<taglib xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-jsptaglibrary_2_1.xsd" version="2.1">

    <tlib-version>1.0</tlib-version>
    <short-name>el</short-name>
    <!-- 將物件format成json字串 -->
    <function>
        <name>toJsonString</name>

        <function-class>com.tydic.emoitor.utils.CommTool</function-class>
        <function-signature>String toJsonString(java.lang.Object)</function-signature>

        <description>將物件format成json字串</description>
        <example>${el:toJsonString(value)}</example>
    </function>
</taglib>
 

將tld檔案放置到WEB-INF/tld目錄下，CommTool中的toJsonString方法就不再寫了，就是java把物件轉換為json的普通程式碼。

1.2 配置web.xml

web.xml中，在和filter同級下新增taglib的配置說明，程式碼如下：

<jsp-config>
		<taglib>
			<!-- 配置標籤的引用地址 JSP頁面中引用時使用-->
			<taglib-uri>mobai.com/el-common</taglib-uri>
			<!-- 配置標籤的TLD檔案地址 -->
			<taglib-location>/WEB-INF/tld/mobai-el-common.tld</taglib-location>
		</taglib>
</jsp-config>
 

1.3 具體使用

在需要用的地方，直接使用：

${el:toJsonString(item.sub_list)}

這就搞定了。

2.html的自定義屬性

問題描述

有時候，我會想把更多的資料捆綁到dom元素上，當進行其他操作時候，不用重新請求後端介面，而是直接使用這些元素，例如：查詢列表的以及詳情展示，我希望在列表中的一個記錄，點選詳情的時候，直接展示詳情，而不用再重新請求介面。這時候就可以使用html的自定義屬性。

2.1 任意自定義

給a標籤新增aflag的標籤

<a href="javascript:toDetail();" aflag=''></a>

當點選a標籤的時候，我們使用如下程式碼獲取aflag裡的內容：

$(this).attr('aflag');

獲取到的內容是字串，轉換成js物件盡情的使用吧。

2.2 繫結物件

我們想繫結複雜物件怎麼辦？我們可以在js中直接拼接html程式碼，對a標籤的aflag讓其直接等於js物件，但是你會發現通過attr取出來的內容是不能用的。這時候就涉及到物件、字串的互轉了。

通過下面方式進行將js物件轉換給json字串。

var str = JSON.stringify(data) ;//物件json字串
var data = eval('(' + str + ')');//字串轉物件
var data = JSON.parse(data); //字串轉物件

將js物件轉換成json字串，切記：

在給a標籤拼接aflag的時候，要注意雙引號和單引號，預設情況下，屬性都是雙引號，但是aflag要使用單引號，例如：

function getAdom(data){
    var str = JSON.JSON.stringify(data);
    var rstr = '<a href="xxx.html" class="dem" aflag='+"'"+str+"'"+'></a>';
    return rstr;
}

這裡進行拼接時候，很容易出錯，要注意。