ASP.Net: Literal vs Label


102

ฉันแค่อยากได้ยินเจ้าหน้าที่บางคนว่าคุณควรใช้การLITERALควบคุมไฟล์LABEL.

ตามที่ฉันเข้าใจความแตกต่างคือ: A LABELสามารถกำหนดสไตล์ผ่าน<SPAN>แท็กที่เพิ่มเข้าไป

ฉันเองพบว่าการเพิ่ม<SPAN>แท็กใน HTML ของฉันน่ารำคาญมากและไม่เคยใช้สไตล์ผ่าน ASP เลยLITERALดูเหมือนว่าจะเป็นสิ่งที่ควรใช้เกือบตลอดเวลา ... แต่ฉันกังวลว่ามีข้อควรพิจารณาหรือประโยชน์อื่น ๆใช้ LABEL ทับโดยที่ฉันไม่รู้ตัว

การแทนที่LABELs ด้วยLITERALs นั้นดี 100% หรือไม่หากเราไม่ได้ใช้สไตล์กับมัน ไม่มีข้อควรพิจารณาอื่น ๆ ?

คำตอบ:


126

ใช่ข้อแตกต่างที่สำคัญคือLiteralการควบคุมเพียงแค่แสดงผลข้อความ แต่Labelการควบคุมล้อมรอบด้วย<span>แท็ก (เว้นแต่คุณจะใช้AssociatedControlIDคุณสมบัติซึ่งในกรณีนี้ตัวLabelควบคุมจะแสดงผล<label>แท็ก)

ดังนั้นจึงสามารถจัดรูปแบบป้ายกำกับได้ง่ายขึ้น แต่ถ้าคุณแค่แทรกข้อความตัวอักษรก็เป็นวิธีที่จะไป การควบคุมตามตัวอักษรยังมีคุณสมบัติที่สะดวกModeซึ่งควบคุมวิธีการแสดงผลข้อความ คุณสามารถเข้ารหัส HTML หรือแสดงผลโดยไม่มีการเปลี่ยนแปลงใด ๆ หรือนำ "องค์ประกอบภาษามาร์กอัปที่ไม่รองรับ" ออก

หากคุณไม่ได้ใช้รูปแบบใด ๆ (เช่นโดยการใช้LabelของCssClassสถานที่ให้บริการ) ก็จะได้รับการปรับเพื่อแทนที่Labelการควบคุมที่มีLiteralการควบคุม


1
ดังนั้นเพื่อให้แน่ใจว่าที่นี่ไม่มีข้อพิจารณาอื่น ๆ เลยหรือ? ฉันถามเพราะคุณเขียน "ความแตกต่างหลักคือ ... " เห็นได้ชัดว่าฉันไม่สนใจในความแตกต่างหลัก ขอบคุณ.
Chuck Le Butt

2
@Django: คำตอบของ Chris Marisic นั้นสำคัญมาก Labelควรใช้การควบคุมASP.Net เสมอเมื่อคุณต้องการ<label>องค์ประกอบHTML นอกเหนือจากนั้นป้ายกำกับยังแสดงข้อความระหว่าง<spans>Literals don't และ Literals ช่วยให้คุณควบคุมวิธีการแสดงผลข้อความได้ดีขึ้น ไม่มีเหตุการณ์พิเศษในการควบคุมใด ๆ และเนื้อหาของพวกเขาสามารถเข้าถึงได้ในรหัสหลังด้วยวิธีเดียวกัน (ผ่านTextคุณสมบัติ)
Graham Clark

2
เช็คบ็อกซ์! ปุ่มวิทยุ! หากคุณใช้Labelการควบคุมคุณสามารถเพิ่มAssociatedControlIDแอตทริบิวต์ด้วย ID ของช่องทำเครื่องหมายหรือปุ่มตัวเลือกที่เกี่ยวข้องกับป้ายกำกับ ด้วยวิธีนี้คุณสามารถคลิกที่ป้ายกำกับและการควบคุมที่เกี่ยวข้องจะเปิดใช้งาน การทำให้พื้นที่เป้าหมายที่คลิกได้มีขนาดใหญ่ขึ้นจะทำให้อินเทอร์เฟซผู้ใช้ใช้งานง่ายขึ้น
Harry Pehkonen

34

เมื่อคุณมีรหัสที่คล้ายกับ

<asp:Label EnableViewState="false" ID="Label8" runat="server" 
        AssociatedControlID="txtEmail">Email Address:</asp:Label>

<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>

เป็นการดีที่สุดที่จะใช้องค์ประกอบป้ายกำกับเนื่องจากจะเปลี่ยนเป็นlabelองค์ประกอบhtml ได้อย่างถูกต้องโดยมีforแอตทริบิวต์ที่ถูกต้องกำหนดเป้าหมายกล่องข้อความของคุณดังนั้นหากผู้ใช้คลิกที่ป้ายกำกับก็จะตั้งค่าเคอร์เซอร์ภายในช่องข้อความโดยอัตโนมัติ

มิฉะนั้นให้ใช้ลิเทอรัลเว้นแต่จะมีข้อความที่อยู่ใน a spanจะเป็นประโยชน์สำหรับการจัดรูปแบบ css


19

ใส่คำอธิบายภาพที่นี่

หากต้องการแสดงข้อความธรรมดาข้อความที่จัดรูปแบบหรือข้อความ HTML เนื่องจากฉันจะเริ่มต้นด้วยตัวอักษรก่อนเนื่องจากมีน้ำหนักเบาและไม่ส่งแท็ก SPAN เพิ่มเติมออกมา

ดูวิดีโอนี้ซึ่งสาธิตเกี่ยวกับแท็กพิเศษเหล่านั้น

แต่เราไม่สามารถใช้ CSS กับลิเทอรัลได้เราไม่สามารถเพิ่มแอตทริบิวต์เช่น Label1.Attributes เพิ่มลงในลิเทอรัล ไม่สามารถบรรลุสิ่งที่มุ่งเน้นคอนเทนเนอร์ใด ๆ เนื่องจากตัวอักษรไม่ได้ล้อมรอบด้วยแท็ก SPAN

เป็นเรื่องน่าเศร้าที่เห็นพวกเว็บฟอร์ม ASP.NET โดยค่าเริ่มต้นเลือกป้ายกำกับเพื่อแสดงข้อความโดยไม่รู้ว่าสร้างแท็ก SPAN พิเศษซึ่งอาจทำให้ HTML ของคุณหนักหากคุณมีป้ายกำกับจำนวนมาก


3

ความแตกต่าง b / w Label และ Literal Control ใน asp.net

ในเกือบทุกวิธีการควบคุม Literal จะเหมือนกับการควบคุมฉลาก การควบคุมทั้งสองนี้ใช้เพื่อแสดงข้อความบนเว็บฟอร์ม (คุณสมบัติ Text สามารถตั้งค่าได้ใน HTML หรือใน code-behind)

ความแตกต่างที่ใหญ่ที่สุดคือการควบคุมป้ายกำกับจะห่อข้อความในspanเมื่อแสดงผล สไตล์ใด ๆ ที่ใช้กับคอนโทรลเลเบลจะแสดงผลโดยใช้styleคุณสมบัติของspan.

ตัวอย่างเช่น HTML ต่อไปนี้

<asp:Label ID="Label1" runat="server"  Text="Label Text"
ForeColor="Red" Font-Bold="true" ></asp:Label>

จะแสดงผลเป็น

<span id="Label1" style="color:Red;font-weight:bold;">Label Text</span>

การควบคุมตามตัวอักษรจะไม่แสดงผลแท็กรอบ ๆ ดังนั้นข้อความจะแสดงตามที่เป็นอยู่:

ตัวอย่างเช่น HTML ต่อไปนี้

<asp:Literal ID="Literal1" runat="server" 
Text="Literal Control Text"></asp:Literal>

จะแสดงผลเป็น

Literal Control Text

ดังนั้นหากคุณต้องการใช้สไตล์ใด ๆ กับ a than use Label control หรือให้ใช้ตัวควบคุม Literal ด้วยเหตุนี้การควบคุมแบบ Literal จึงเป็นการควบคุมน้ำหนักที่เบาเมื่อเปรียบเทียบกับการควบคุมฉลาก

FYI: ลำดับชั้นการสืบทอดสำหรับคลาสควบคุมตัวอักษรคือ(Object => Control => Literal)โดยที่สำหรับการควบคุมป้ายชื่อลำดับชั้นคือ(Object => Control => WebControl => Label)


1
ตัวอักษรmode="PassThrough": techrepublic.com/blog/software-engineer/...
PreguntonCojoneroCabrón
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.