Ukryta wartość danych wejściowych jQuery Access

Odpowiedzi:

347

Możesz uzyskać dostęp do wartości ukrytych pól za pomocą val(), tak jak możesz to zrobić w przypadku każdego innego elementu wejściowego:

<input type="hidden" id="foo" name="zyx" value="bar" />

alert($('input#foo').val());
alert($('input[name=zyx]').val());
alert($('input[type=hidden]').val());
alert($(':hidden#foo').val());
alert($('input:hidden[name=zyx]').val());

To wszystko oznacza to samo w tym przykładzie.

Tatu Ulmanen
źródło
11
alert ($ ('input [type = hidden] #foo'). val ()); Znajduje ukrytą zmienną o identyfikatorze foo. To wyszukiwanie jest bardziej szczegółowe.
Mohammed Rafeeq,
6
@MohammedRafeeq alert ($ ('# foo'). Val ()); Jest tak samo konkretny. Ponieważ identyfikator jest unikalny w DOM. Dlatego zawsze znajdzie tylko jeden element, jeśli kod HTML jest zgodny ze standardami. Chyba że używasz instrukcji, aby sprawdzić, czy element jest ukryty, czy nie.
Edwin Stoteler
1
co jest szybsze $ ('# foo') czy $ ('input: hidden # foo')? Podejrzewam, że to drugie, ponieważ podano więcej informacji o wyszukiwaniu, ale nie jestem pewien, jak to jest zaimplementowane, więc nie wiem, czy moje odczucie jest prawidłowe. EDYCJA: ok mam swoją odpowiedź dzięki komentarzowi Abela, tylko id, czyli #foo jest szybsze.
comte
15

Do tego służy selektor jQuery:

// Get all form fields that are hidden
var hidden_fields = $( this ).find( 'input:hidden' );

// Filter those which have a specific type
hidden_fields.attr( 'text' );

Wyświetli wszystkie ukryte pola wprowadzania i przefiltruje je według tych z określonym type="".

kajzer
źródło
2
Zauważ, że będzie to również pasować do elementów, które nie mają wartości wyświetlanej CSS, elementów, które mają szerokość i wysokość ustawioną na 0, oraz elementów, które mają ukrytego przodka ( api.jquery.com/hidden-selector )
Daniel Liuzzi
6

Aby uzyskać wartość, użyj:

$.each($('input'),function(i,val){
    if($(this).attr("type")=="hidden"){
        var valueOfHidFiled=$(this).val();
        alert(valueOfHidFiled);
    }
});

lub:

var valueOfHidFiled=$('input[type=hidden]').val();
alert(valueOfHidFiled);

Aby ustawić wartość, użyj: 

$('input[type=hidden]').attr('value',newValue);
Korzeń
źródło
4

Nie ma nic specjalnego w <input type="hidden">:

$('input[type="hidden"]').val()
Maxim Sloyko
źródło
3

Jeśli chcesz wybrać pojedyncze ukryte pole, możesz je wybrać za pomocą różnych selektorów jQuery:

<input type="hidden" id="hiddenField" name="hiddenField" class="hiddenField"/> 


$("#hiddenField").val(); //by id
$("[name='hiddenField']").val(); // by name
$(".hiddenField").val(); // by class
Rodrigo Longo
źródło
Ukryte dane wejściowe nie mają właściwości klasy stylu
Philip Puthenvila
3

Jeśli masz asp.net HiddenField, musisz:

Aby uzyskać dostęp do wartości HiddenField:

$('#<%=HF.ClientID%>').val()  // HF = your hiddenfield ID

Aby ustawić HiddenFieldValue 

$('#<%=HF.ClientID%>').val('some value')   // HF = your hiddenfield ID
Bruno Ferreira
źródło
1

Uważaj, jeśli chcesz odzyskać wartość logiczną z ukrytego pola!

Na przykład:

<input type="hidden" id="SomeBoolean" value="False"/>

(Takie dane wejściowe będą renderowane przez ASP MVC, jeśli używasz @Html.HiddenFor(m => m.SomeBoolean) ).

Następujące polecenie zwróci ciąg znaków 'False', a nie wartość logiczną JS!

var notABool = $('#SomeBoolean').val();

Jeśli chcesz użyć wartości logicznej dla jakiejś logiki, użyj zamiast tego:

var aBool = $('#SomeBoolean').val() === 'True';
if (aBool) { /* ...*/ }
Georg Patscheider
źródło
-1

Najbardziej uniwersalnym sposobem jest przyjmowanie wartości według nazwy. Nie ma znaczenia, czy jego dane wejściowe, czy wybierz typ elementu formularza.

var value = $('[name="foo"]');
Marcin Żurek
źródło