本發明專利技術提供一種應用于瀏覽器的數據處理方法及裝置，所述瀏覽器包括用于輸入文本的輸入框，所述方法包括以下步驟：創建標簽，其中，所述標簽覆蓋于所述輸入框上，且所述標簽的文本內容為對所述輸入框需輸入字段預期值的提示信息；判斷當前瀏覽器是否支持占位符placeholder屬性；若當前瀏覽器不支持placeholder屬性，則監聽所述輸入框的input事件；若監聽到所述輸入框的input事件，則判斷所述輸入框的值是否為空；如果輸入框的值為空，則顯示標簽；如果輸入框的值不為空，則隱藏標簽。上述方法和裝置可在不影響輸入框實際功能的情況下模擬placeholder屬性。
【技術實現步驟摘要】
本專利技術屬于計算機
，尤其涉及一種應用于瀏覽器的文本輸入框顯示方法和裝置。
技術介紹
html5為input元素新增了一個屬性“placeholder”,提供對輸入字段預期值的提示信息。如圖1所示，當input為空且未獲得焦點時,所述提示信息顯示。如圖2所示，當input獲得焦點時,所述提示信息消失。雖然，目前大部分瀏覽器都對placeholder屬性提供了支持，但如IE6?IE9等瀏覽器卻不支持placeholder屬性,在這些不支持原生placeholder屬性的瀏覽器下,通常使用value值來模擬placeholder屬性。S卩，如果input為空且未獲得焦點，就把value值設置為placeholder屬性的值,一旦獲得焦點，則將該input的值清空。這種方式在一些情況下會有問題，比如type =“password”的input的value值是以星號顯示的,無法直接顯示文字，除非同時更改type類型。再如,會給表單驗證帶來麻煩,如果某input是必填的,那么提交表單的時候該input的value為空或者為placeholder值時都不應該被提交,所以我們要增加對value為placeholder的判斷,不過如果項目里使用了驗證插件，而插件本身又不支持這種方式，還是會帶來些麻煩的。
技術實現思路
本專利技術的目的在于提供一種應用于瀏覽器的文本輸入框顯示方法和裝置，旨在解決現有技術中的上述技術問題。為解決上述技術問題，本專利技術實施例提供以下技術方案:一種應用于瀏覽器的數據處理方法，所述瀏覽器包括用于輸入文本的輸入框，所述方法包括以下步驟:創建標簽，其中，所述標簽覆蓋于所述輸入框上，且所述標簽的文本內容為對所述輸入框需輸入字段預期值的提示信息；判斷當前瀏覽器是否支持占位符placeholder屬性；若當前瀏覽器不支持placeholder屬性,則監聽所述輸入框的輸入input事件；若監聽到所述輸入框的input事件，則判斷所述輸入框的值是否為空；如果輸入框的值為空，則顯示所述標簽；如果輸入框的值不為空，則隱藏所述標簽。一種應用于瀏覽器的數據處理裝置，所述瀏覽器包括用于輸入文本的輸入框，所述裝置包括:創建單元，用于創建標簽，其中，所述標簽覆蓋于所述輸入框上，且所述標簽的文本內容為對所述輸入框需輸入字段預期值的提示信息；第一判斷單元，用于判斷當前瀏覽器是否支持占位符placeholder屬性；監聽單元，用于若當前瀏覽器不支持placeholder屬性，則監聽所述輸入框的輸入input事件；第二判斷單元，用于若監聽到所述輸入框的input事件，則判斷所述輸入框的值是否為空;顯示單元，用于如果輸入框的值為空，則顯示所述標簽；隱藏單元，用于如果輸入框的值不為空，則隱藏所述標簽。本專利技術實施例提供的應用于瀏覽器的文本輸入框顯示方法，提供了一種插入一個覆蓋在input上的標簽(label標簽)來模擬placeholder的方式,相比較現有利用輸入框的value值來模擬placeholder提示信息的方法,本實施例的方法可避免在提交表單的時候將placeholder的屬性值當做輸入框的value值來提交，從而實現了在不影響輸入框實際功能的情況下模擬了 placeholder屬性。【附圖說明】圖1是本專利技術現有的應用于瀏覽器的文本輸入框示意圖；圖2是本專利技術第一實施例中應用于瀏覽器的文本輸入框顯示方法的流程示意圖；圖3為本專利技術第二實施例中應用于瀏覽器的文本輸入框顯示方法的流程示意圖；圖4是本專利技術第三實施例中應用于瀏覽器的文本輸入框顯示裝置的流程示意圖；圖5是本專利技術第四實施例中應用于瀏覽器的文本輸入框顯示裝置的結構示意圖。【具體實施方式】請參照圖式，其中相同的組件符號代表相同的組件，本專利技術的原理是以實施在一適當的運算環境中來舉例說明。以下的說明是基于所例示的本專利技術具體實施例，其不應被視為限制本專利技術未在此詳述的其它具體實施例。在以下的說明中，本專利技術的具體實施例將參考由一部或多部計算機所執行之作業的步驟及符號來說明，除非另有述明。因此，其將可了解到這些步驟及操作，其中有數次提到為由計算機執行，包括了由代表了以一結構化型式中的數據之電子信號的計算機處理單元所操縱。此操縱轉換該數據或將其維持在該計算機之內存系統中的位置處，其可重新配置或另外以本領域技術人員所熟知的方式來改變該計算機之運作。該數據所維持的數據結構為該內存之實體位置，其具有由該數據格式所定義的特定特性。但是，本專利技術原理以上述文字來說明，其并不代表為一種限制，本領域技術人員將可了解到以下所述的多種步驟及操作亦可實施在硬件當中。本專利技術的原理使用許多其它泛用性或特定目的運算、通信環境或組態來進行作業。所熟知適合用于本專利技術的運算系統、環境與組態的范例可包括(但不限于)行動電話、個人計算機、服務器、多處理器系統、微電腦為主的系統、主架構型計算機、及分布式運算環境，其中包括了任何的上述系統或裝置。如在此處使用的術語「模塊」或「單元」可稱之為在該運算系統上執行的軟件對象或例式。在此處所述之不同組件、模塊、引擎及服務可實施為在該運算系統上執行之對象或處理。而在此處所述的系統及方法優選地是實施成軟件，在軟件及硬件或硬件上之實施亦有可能并進行考慮。請參閱圖2，圖2為本專利技術第一實施例中應用于瀏覽器的文本輸入框顯示方法的流程示意圖，其中所述瀏覽器包括用于輸入文本的輸入框。所述應用于瀏覽器的文本輸入框顯示方法包括以下步驟:步驟SI 10，創建標簽(即label標簽)，其中，所述標簽覆蓋于所述輸入框上，且所述標簽的文本內容為對所述輸入框需輸入字段預期值的提示信息。具體的，標簽為input元素定義標注(標記)，label元素不會向用戶呈現任何特殊效果。不過，它為鼠標用戶改進了可用性。如果用戶在label元素內點擊文本，就會觸發此控件。就是說，當用戶選擇該標簽時，瀏覽器就會自動將焦點轉到和標簽相關的表單控件上。其中，所述輸入字段預期值的提示信息可以為“請輸入手機號”、“請輸入QQ號”及“支持QQ號/油箱/手機號登錄”等用于提示用戶在所述輸入框輸入正確文本的提示語。步驟S120,判斷當前瀏覽器是否支持占位符placeholder屬性。步驟S130,若當前瀏覽器不支持placeholder屬性，則監聽所述輸入框的輸入input事件。步驟S140，若監聽到所述輸入框的input事件，則判斷所述輸入框的值是否為空。步驟S150，如果輸入框的值為空，則顯示所述標簽。步驟S160，如果輸入框的值不為空，則隱藏所述標簽。上述用于瀏覽器的文本輸入框顯示方法，提供了一種插入一個覆蓋在input上的la當前第1頁1 2 3 本文檔來自技高網...
【技術保護點】
一種應用于瀏覽器的數據處理方法，所述瀏覽器包括用于輸入文本的輸入框，其特征在于，所述方法包括以下步驟：創建標簽，其中，所述標簽覆蓋于所述輸入框上，且所述標簽的文本內容為對所述輸入框需輸入字段預期值的提示信息；判斷當前瀏覽器是否支持占位符placeholder屬性；若當前瀏覽器不支持placeholder屬性，則監聽所述輸入框的輸入input事件；若監聽到所述輸入框的input事件，則判斷所述輸入框的值是否為空；如果輸入框的值為空，則顯示所述標簽；如果輸入框的值不為空，則隱藏所述標簽。
【技術特征摘要】
【專利技術屬性】
技術研發人員：劉志凱，
申請(專利權)人：騰訊科技深圳有限公司，
類型：發明
國別省市：廣東;44
還沒有人留言評論。發表了對其他瀏覽者有用的留言會獲得科技券。