ความแตกต่างระหว่าง val () และข้อความ ()

อะไรคือความแตกต่างระหว่างฟังก์ชั่นของ jQuery val()และtext()?

คุณจะใช้อันไหนมากกว่ากัน

.val()ใช้งานได้กับองค์ประกอบอินพุต (หรือองค์ประกอบใด ๆ ที่มีคุณลักษณะค่าหรือไม่) และ.text()จะไม่ทำงานกับองค์ประกอบอินพุต .val()รับค่าขององค์ประกอบอินพุต - โดยไม่คำนึงถึงชนิด .text()รับ InnerText (ไม่ใช่ HTML) ขององค์ประกอบที่ตรงกันทั้งหมด:

.text()

ผลลัพธ์คือสตริงที่มีเนื้อหาข้อความรวมขององค์ประกอบที่ตรงกันทั้งหมด วิธีนี้ใช้ได้กับทั้งเอกสาร HTML และ XML ไม่สามารถใช้กับองค์ประกอบอินพุตได้ สำหรับข้อความฟิลด์อินพุตให้ใช้แอ็ตทริบิวต์ val

.val()

รับเนื้อหาของแอตทริบิวต์ค่าขององค์ประกอบที่ตรงกันแรก

text () คืนค่าเนื้อหาข้อความแบบรวมขององค์ประกอบที่ตรงกันทั้งหมด (เช่น p, div และอื่น ๆ ) val () ใช้เพื่อรับค่าขององค์ประกอบอินพุต (เช่นอินพุตเลือกและอื่น ๆ )

ไม่ควรใช้ข้อความเอกสารอย่างเป็นทางการ () กับองค์ประกอบอินพุต

val () ใช้เพื่อดึงค่าจากประเภทอินพุต html ทุกประเภทเช่น (ช่องทำเครื่องหมายข้อความ ฯลฯ ) ซึ่งผู้ใช้มีตัวเลือกให้ป้อนค่า Ex: -

<input type="text" id="txt_name" /> 
 <input type="checkbox" name="vehicle" value="Bike" id="chk_byk" class="ss">bike<br>   
<script type="text/javascript">
 $(document).ready(function () {

            $("#btn_submit").click(function () {
                alert($("#chk_byk").val());
            });

            });


    </script> 

โดยที่ as text () ใช้เพื่อดึงค่าจากองค์ประกอบ html ที่ผู้ใช้จะไม่โต้ตอบเช่น (p, div ฯลฯ )

    <p id="p1">Hi how are u??</p>
 <div id="dv5">Debendra</div>

 <script type="text/javascript">

        $(document).ready(function () {

            $("#btn_submit").click(function () {
                alert($("#dv5").text());
            });

            });


    </script>

.val () ฟังก์ชั่นคืนค่าจากองค์ประกอบอินพุตและ. text () ฟังก์ชั่นส่งกลับค่าจากอื่นนอกเหนือจากองค์ประกอบอินพุต นอกจากนี้เรายังสามารถส่งผ่านอาร์กิวเมนต์สตริงฟังก์ชั่นเหล่านี้ในการตั้งค่าขององค์ประกอบการเรียก โค้ดด้านล่างแสดงวิธีตั้งค่าองค์ประกอบ DOM โดยใช้ฟังก์ชัน. val () และ. text ():

ส่วน HTML:

<form id="form1"><input id="first" type="text" /><input type="submit" /></form>
<div id="second">Click the "Submit Query" to see it work</div>

ส่วน Jquery:

$(document).on("submit", "form", function (e) {
    $("#first").val("This input is set by .val() function");
    $("#second").text("A new text is set using .text() function!");
    return false;
})

ตัวอย่าง: http://jsfiddle.net/urhys9zj/6/