รับค่าชื่อแอตทริบิวต์ของ <input>

วิธีรับค่าชื่อแอตทริบิวต์ของแท็กอินพุตโดยใช้ jQuery กรุณาช่วย.

<input name='xxxxx' value=1>

ระบุรหัสที่คุณป้อนและใช้attrวิธีการ:

var name = $("#id").attr("name");

ใช้attrวิธีการของ jQuery ดังนี้:

alert($('input').attr('name'));

โปรดทราบว่าคุณยังสามารถใช้attrเพื่อตั้งค่าแอตทริบิวต์โดยระบุอาร์กิวเมนต์ที่สอง:

$('input').attr('name', 'new_name')

var value_input = $("input[name*='xxxx']").val();

แม้ว่าจะไม่มีการปฏิเสธว่า jQuery เป็นเครื่องมือที่มีประสิทธิภาพ แต่ก็เป็นความคิดที่ไม่ดีเลยที่จะใช้มันสำหรับการดำเนินการที่ไม่สำคัญเช่น "รับค่าแอตทริบิวต์ขององค์ประกอบ"

ตัดสินโดยคำตอบที่ยอมรับในปัจจุบันฉันจะถือว่าคุณสามารถเพิ่มแอตทริบิวต์ ID ให้กับองค์ประกอบของคุณและใช้เพื่อเลือก

ด้วยเหตุนี้จึงมีโค้ดสองส่วน อันดับแรกรหัสที่มอบให้คุณในคำตอบที่ยอมรับ:

$("#ID").attr("name");

และประการที่สองเวอร์ชันVanilla JSของมัน:

document.getElementById('ID').getAttribute("name");

ผลลัพธ์ของฉัน:

• jQuery: การดำเนินการ 300k / วินาที
• JavaScript: การดำเนินการ 11,000k / วินาที

คุณสามารถทดสอบด้วยตัวคุณเองที่นี่ เวอร์ชัน"JavaScript ธรรมดา" เร็วกว่าเวอร์ชัน jQuery มากกว่า 35 เท่า

ตอนนี้เป็นเพียงการดำเนินการเดียวเมื่อเวลาผ่านไปคุณจะมีสิ่งต่างๆเกิดขึ้นในโค้ดของคุณมากขึ้นเรื่อย ๆ บางทีสำหรับบางอย่างขั้นสูงโดยเฉพาะโซลูชัน "JavaScript บริสุทธิ์" ที่ดีที่สุดอาจใช้เวลาหนึ่งวินาทีในการทำงาน เวอร์ชัน jQuery อาจใช้เวลา 30 วินาทีถึงนาทีเดียว! มันใหญ่มาก! ผู้คนจะไม่นั่งเฉยๆ แม้แต่เบราว์เซอร์ก็เบื่อและเสนอตัวเลือกให้คุณฆ่าหน้าเว็บที่ใช้เวลานานเกินไป!

ที่ผมกล่าวว่า jQuery เป็นเครื่องมือที่มีประสิทธิภาพ แต่มันควรจะไม่ได้รับการพิจารณาคำตอบของทุกอย่าง

คุณต้องเขียนตัวเลือกที่เลือกที่ถูกต้อง<input>ก่อน เป็นการดีที่คุณใช้รหัสองค์ประกอบของ$('#element_id')ความล้มเหลวที่ประชาชนของมันภาชนะหรือระดับองค์ประกอบของ$('#container_id input')$('input.class_name')

องค์ประกอบของคุณไม่มีสิ่งเหล่านี้และไม่มีบริบทดังนั้นจึงยากที่จะบอกคุณว่าจะเลือกอย่างไร

เมื่อคุณหาตัวเลือกที่เหมาะสมได้แล้วคุณจะต้องใช้เมธอดattrเพื่อเข้าถึงแอตทริบิวต์ขององค์ประกอบ เพื่อให้ได้ชื่อที่คุณต้องการใช้$(selector).attr('name')ซึ่งจะกลับมา 'xxxxx'(ในตัวอย่างของคุณ)

วิธีที่ดีกว่าคือการใช้ 'this' โดยใช้ชื่อของ 'id' เป็นอะไรก็ได้และใช้มัน ตราบใดที่คุณเพิ่มชื่อคลาสที่เรียกว่า 'mytarget'

เมื่อใดก็ตามที่ฟิลด์ใด ๆ ที่มีการเปลี่ยนแปลงเป้าหมายจะแสดงกล่องการแจ้งเตือนพร้อมชื่อของฟิลด์นั้น เพียงแค่ตัดและผ่านสคริปต์ทั้งหมดเพื่อให้ใช้งานได้!

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
 $('.mytarget').change(function() {
var name1 = $(this).attr("name");
alert(name1);
 });
});
</script>

Name: <input type="text" name="myname" id="myname" class="mytarget"><br />
Age: <input type="text" name="myage" id="myage" class="mytarget"><br />

var theName;

theName = $("input selector goes here").attr("name");

ใช้ค่ารับชื่ออินพุต

 $('input[value="1"]').attr('name');

ใช้ id get input name

 $('input[class="id"]').attr('name');
   $('#id').attr('name');

ใช้ class get input name

 $('input[value="classname"]').attr('name');
   $('.classname').attr('name');  //if classname have unique value

หากคุณกำลังจัดการกับองค์ประกอบหนึ่งโดยเฉพาะอย่างยิ่งคุณควรใช้idตัวเลือกตามที่ระบุไว้ในคำตอบ GenericTypeTea $("#id").attr("name");และได้รับชื่อเช่น

แต่ถ้าคุณต้องการอย่างที่ฉันทำเมื่อฉันพบคำถามนี้รายการที่มีชื่ออินพุตทั้งหมดของคลาสเฉพาะ (ในตัวอย่างของฉันคือรายการที่มีชื่อของช่องทำเครื่องหมายที่ไม่ได้เลือกทั้งหมดกับ.selectable-checkboxคลาส) คุณสามารถทำสิ่งต่างๆเช่น:

var listOfUnchecked = $('.selectable-checkbox:unchecked').toArray().map(x=>x.name);

หรือ

var listOfUnchecked = [];
$('.selectable-checkbox:unchecked').each(function () {
    listOfUnchecked.push($(this).attr('name'));
});

ส่งผ่านคลาสไปยังแท็กอินพุตและเข้าถึงค่าชื่อโดยใช้คลาส

<input class="test-class" name='xxxxx' value=1>

<script>
    $('.test-class').attr('name');
</script>

หรือคุณสามารถเข้าถึงค่าโดยใช้ id

<input id="test-id" name='xxxxx' value=1>

<script>
    $('#test-id').attr('name');
</script>

สำหรับบรรทัดด้านล่างในขั้นต้นประสบปัญหาในการให้รหัสเดียวที่ 'currnetRowAppName'value ไม่ใช้พื้นที่กับสตริง ดังนั้นหลังจากนั้นให้รหัสเดียว'"+row.applicationName+"'มันก็ใช้พื้นที่เช่นกัน

ตัวอย่าง:

<button class='btn btn-primary btn-xs appDelete' type='button' currnetRowAppName='"+row.applicationName+"' id="+row.id+ >

var viewAppNAME = $(this).attr("currnetRowAppName");
alert(viewAppNAME)

ใช้งานได้ดี