a標簽


a標簽

CreateTime--2016年9月29日09:39:35

Author:Marydon

UpdateTime--2017年6月5日17:00:37

1.語法

    <a href="url">跳轉</a>

2.跳轉路徑攜帶參數

  方式一:EL表達式

<a style="color: #199ED8;font-weight: bolder;margin-right: 15px;"
    href="${pageContext.request.contextPath }/telemedicine/reseCons/viewAdd_manual.do?ORGID=${model.ORGID}&ORGNAME=${model.ORGNAME}">
    選擇並繼續> 
</a>   

  方式二:<c:url></c:url>

<a style="color: #199ED8;font-weight: bolder;margin-right: 15px;"
    href="<c:url value="/telemedicine/reseCons/viewAdd_manual.do?ORGID=${model.ORGID}&ORGNAME=${model.ORGNAME}"/>">
    選擇並繼續> 
</a>

  方式三:使用小腳本

<a style="color: #199ED8;font-weight: bolder;margin-right: 15px;"
    href="<%=request.getContextPath()%>/telemedicine/reseCons/viewAdd_manual.do?ORGID=${model.ORGID}&ORGNAME=${model.ORGNAME}">
    選擇並繼續> 
</a>

UpdateTime--2017年8月18日10:29:11

3.你不認識的href

  參考鏈接:http://blog.csdn.net/u010297791/article/details/52784879 

  href的作用:超鏈接、調用js、回到頁面頂部

    2.3.1 超鏈接 href="URL"

     方式一:URL=絕對路徑

     指向另一個站點或本站(比如 href="http://www.example.com/index.htm"),構成必須以:網絡協議+”://" 開頭

    方式二:URL=相對路徑

     指向站點內的某個文件(href="index.htm"),相對路徑會自動補全請求前綴,分為兩種情況:以"/"開頭和不帶"/"

      情況說明之不帶"/"

      實際構成:本頁面所在路徑(不一定是地址欄輸出的地址)+href的值

      情況說明之以"/"開頭

      實際構成:服務器路徑(如:http://localhost:8060)+href的值

    方式三:URL=錨URI

    指向頁面中的錨(href="#top")

    此時指向頁面中的錨,比如href="#top",那么點擊時就會到當前頁面中id="top"的這個錨點,實現當前頁面的所謂跳轉。

    用的最多就是在可滾動頁面中,添加菜單,可以直接回到頁面中的某個部分的內容。

    實例:

    

    本頁面所在地址
      http://127.0.0.1:8060/ycyl/telemedicine/patient/index.do?RESULT_TYPE=modelAndView1

    說明:頁面上的查看詳細信息是個a標簽,通過改變href的值來證實不同的情況

    情景1:href="aa"(前面沒有"/")

      鼠標懸浮時,解析為:"http://127.0.0.1:8060/ycyl/telemedicine/patient/aa"

      解說:將本頁面的所在的路徑加了上去:"http://127.0.0.1:8060/ycyl/telemedicine/patient/"

       情景2:href="${pageContext.request.contextPath }/telemedicine/reseCons/index.do"(前面帶有"/")

      鼠標懸浮時,解析為:"http://127.0.0.1:8060/ycyl/telemedicine/reseCons/index.do"

      解說:只添加"http://127.0.0.1:8060"

    情景3:href="http://aa.jsp"(前面添加http://)

      鼠標懸浮時,解析為:href="http://aa.jsp"

      解說:http://aa.jsp,不再自動加東西

     情景4:href="telemedicine/reseCons/index.do"(有一部分是與本頁面的請求路徑前綴相同)

      鼠標懸浮時,解析為:"http://127.0.0.1:8060/ycyl/telemedicine/patient/telemedicine/reseCons/index.do"

      解說:仍會將本頁面所在路徑添加上去:"http://127.0.0.1:8060/ycyl/telemedicine/patient/",雖有部分相同,但是不會只添加不重復的部分

 

    2.3.2 調用js href="javascript:void(0);"

    方式一:href="javascript:js代碼;" (不推薦使用)

    點評:

      這是常用的方法,但是這種方法在傳遞this等參數的時候很容易出問題,而且javascript:協議作為a的href屬性的時候不僅會導致不必要的觸發window.onbeforeunload事件,

      在IE里面更會使gif動畫圖片停止播放;

      W3C標准不推薦在href里面執行javascript語句。

    方式二:href="javascript:void(0);" onclick="js代碼"(推薦使用)

    點評:

      這種方法是很多網站最常用的方法,也是最周全的方法,onclick方法負責執行js函數,而void是一個操作符,void(0)返回undefined,地址不發生跳轉;

      而且這種方法不會像第一種方法一樣直接將js方法暴露在瀏覽器的狀態欄。

    方式三:href="javascript:;" onclick="js代碼"(推薦使用)

    點評:

       這種方法跟跟2種類似,區別只是執行了一條空的js代碼。

    方式四:href="#" onclick="js代碼"

    點評:

      這種方法也是網上很常見的代碼,#是標簽內置的一個方法,代表top的作用。所以用這種方法點擊后網頁后返回到頁面的最頂端。

    變形:href="#pageLocation" onclick="js代碼"

    點評:a標簽在本頁跳轉的同時,又可以執行js代碼。

    例子:本博客的點擊“添加好友”鏈接,跳轉到指定位置並關閉彈窗。

    方式五:href="#" onclick="js代碼;return false;"

    點評:

      這種方法點擊執行了js函數后return false,頁面不發生跳轉,執行后還是在頁面的當前位置。

    2.3.3 href="#"

     a中href="#"表示回到最頂部。

    如果當前頁面中需要滾動的話,那么用這種方式就可以直接回到頂部。

    比如有些網站會在右下角制作一個圖標按鈕,回到頂部,那么此時可以考慮用這種最簡單的方式實現。

    2.3.4 href="url#id"

    跳轉到指定頁面URL上id="指定id"的位置

UpdateTime--2017年8月22日16:58:33

4.target屬性

  target的默認值是"_self",表示在當前頁面進行跳轉;

  target="_blank",表示的是在一個新的標簽頁上打開該鏈接         

 

 相關推薦:

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM