Uzyskaj wartość nazwy atrybutu <input>

Jak uzyskać wartość nazwy atrybutu tagu wejściowego za pomocą jQuery. Proszę pomóż.

<input name='xxxxx' value=1>

Podaj swoje dane wejściowe identyfikator i użyj attrmetody:

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

Użyj attrmetody jQuery w następujący sposób:

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

Zauważ, że możesz również użyć attrdo ustawienia wartości atrybutów, określając drugi argument:

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

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

Chociaż nie można zaprzeczyć, że jQuery jest potężnym narzędziem, to naprawdę złym pomysłem jest używanie go do tak banalnej operacji, jak „pobranie wartości atrybutu elementu”.

Sądząc po aktualnie zaakceptowanej odpowiedzi, zakładam, że udało Ci się dodać atrybut ID do swojego elementu i użyć go, aby go wybrać.

Mając to na uwadze, oto dwa fragmenty kodu. Najpierw kod podany w zaakceptowanej odpowiedzi:

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

Po drugie, wersja Vanilla JS :

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

Moje wyniki:

• jQuery: 300k operacji / sekundę
• JavaScript: 11 000 000 operacji na sekundę

Można przetestować dla siebie tutaj . Wersja „zwykłego JavaScript” jest ponad 35 razy szybsza niż wersja jQuery.

To tylko jedna operacja, z czasem w kodzie będzie się działo coraz więcej rzeczy. Być może w przypadku czegoś szczególnie zaawansowanego uruchomienie optymalnego rozwiązania „czystego JavaScript” zajmie jedną sekundę. Wersja jQuery może zająć od 30 sekund do całej minuty! To jest ogromne! Ludzie nie będą z tego powodu siedzieć. Nawet przeglądarka znudzi się i zaoferuje opcję zabicia strony internetowej za zbyt długi czas!

Jak powiedziałem, jQuery to potężne narzędzie, ale to powinno nie być uważane za odpowiedź na wszystko .

Musisz napisać selektor, który <input>najpierw wybiera właściwy . Idealnie $('#element_id')byłoby użyć identyfikatora elementu , w przypadku niepowodzenia nie jest to identyfikator jego kontenera $('#container_id input')lub klasa elementu $('input.class_name').

Twój element nie ma żadnego z tych elementów ani kontekstu, więc trudno powiedzieć, jak go wybrać.

Kiedy już ustalisz właściwy selektor, możesz użyć metody attr , aby uzyskać dostęp do atrybutów elementu. Aby uzyskać nazwę, użyjesz znaku, $(selector).attr('name')który zwróci (w twoim przykładzie) 'xxxxx'.

Lepszym sposobem mogłoby być użycie „this”, niezależnie od nazwy „id” i jej użycia. Dopóki dodajesz nazwę klasy o nazwie „mytarget”.

Za każdym razem, gdy zmieni się którekolwiek z pól, które mają wartość docelową, pojawi się okno alertu z nazwą tego pola. Po prostu wytnij i pomiń cały skrypt, aby działał!

<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");

używając wartości pobierz nazwę wejściową

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

używając id pobierz nazwę wejściową

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

używając klasy pobierz nazwę wejściową

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

Jeśli masz do czynienia z pojedynczym elementem, najlepiej użyj idselektora podanego w odpowiedzi GenericTypeTea i uzyskaj nazwę taką jak $("#id").attr("name");.

Ale jeśli chcesz, tak jak ja, gdy znalazłem to pytanie, listę ze wszystkimi nazwami wejściowymi określonej klasy (w moim przykładzie lista z nazwami wszystkich niezaznaczonych pól wyboru z .selectable-checkboxklasą) możesz zrobić coś takiego:

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

lub

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

Przekaż klasę do znacznika wejściowego i uzyskaj dostęp do wartości nazwy przy użyciu class.

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

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

Możesz też uzyskać dostęp do wartości za pomocą id.

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

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

W poniższym wierszu początkowo napotkał problem bez podania pojedynczego kodu, którego wartość „currnetRowAppName” nie zajmuje miejsca w ciągu. Tak więc, po tym podaniu jednego kodu '"+row.applicationName+"', zajmuje on również miejsce.

Przykład:

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

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

To działa dobrze.