Porównaj ceny domen i usług IT, sprzedawców z całego świata

JavaScript, aby ustawić ukrytą wartość formularza przy zmianie listy rozwijanej


Nowy w javascript, ale jestem pewien, że to łatwe. Niestety większość wyników Google nie była pomocna.
W każdym razie chcę ustawić wartość ukrytego elementu formularza za pomocą javascript, gdy lista rozwijana zostanie zmieniona.
Mogę użyć jQuery, jeśli ułatwia to pobieranie lub ustawianie wartości.
Zaproszony:
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Jeśli masz taki HTML, na przykład:
<select id='myselect'>
<option value='1'>A</option>
<option value='2'>B</option>
<option value='3'>C</option>
<option value='4'>D</option>
</select>
<input type='hidden' id='myhidden' value=''>

Wszystko co musisz zrobić to

powiązać funkcję ze zdarzeniem
change
select
http://docs.jquery.com/Events/change#fn
i rób to, czego potrzebujesz:
<script type='text/javascript'>
$(function() {
$('#myselect').change(function() {
// if changed to, for example, the last option, then
// $(this).find('option:selected').text() == D
// $(this).val() == 4
// get whatever value you want into a variable
var x = $(this).val();
// and update the hidden input's value
$('#myhidden').val(x);
});
});
</script>

Biorąc wszystko pod uwagę, jeśli zamierzasz robić wiele programów jQuery, zawsze miej otwarte oprogramowanie

dokumentacja
http://docs.jquery.com/Main_Page... Bardzo łatwo jest tam znaleźć to, czego potrzebujesz, jeśli dasz mu szansę.
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Zwykły stary Javascript:
<script type="text/javascript">function changeHiddenInput (objDropDown)
{
var objHidden = document.getElementById("hiddenInput");
objHidden.value = objDropDown.value;
}</script>
<form>
<select id="dropdown" name="dropdown" onchange="changeHiddenInput(this)">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select> <input type="hidden" name="hiddenInput" id="hiddenInput" value=""/>
</form>
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Walczyłem z tym przez długi czas, ale nic nie działało ... dopóki nie zdałem sobie sprawy, że konstrukcja
#
wymaga identyfikatora, a nie nazwy. Więc jeśli „
.val (x)
nie działa!” To twój problem, sprawdź swój element i upewnij się, że ma identyfikator!
To mnie dezorientuje, ale czułem, że muszę się tym podzielić, aby uchronić innych przed wyrywaniem włosów.
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Oto, jak ustawić ukrytą wartość zdarzenia zmiany z listy rozwijanej:
$('#myDropDown').bind('change', function () {
$('#myHidden').val('setted value');
});

Twoja ukryta i rozwijana lista:
<input type="hidden" id="myHidden"/><select id="myDropDown">
<option value="opt 1">Option 1</option>
<option value="opt 2">Option 2</option>
<option value="opt 3">Option 3</option>
</ select>
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

To jest z jQuery.
$('#selectFormElement').change( function() {
$('#hiddenFormElement').val('newValue');
} );


W roku html

<select id="selectFormElement" name="..."> ... </select>
<input type="hidden" name="..." id="hiddenFormElement"/>
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

Żeby było inaczej, zmieniłem moją odpowiedź tak, że nie ma 5 odpowiedzi na to pytanie z tym samym kodem.
<html>
<head>
<title>Page</title>
<script src="jquery-1.3.2.min.js"></script>
<script>
$(function() {
var select = $("body").append('<form></form>').children('form')
.append('<input type="hidden" value=""/>').children('input[type=hidden]')
.attr('id', 'hiddenValue').end()
.append('<select></select>').children('select')
.attr('id', 'dropdown')
.change(function() {
alert($(this).val());
}); $.each({ one: 1, two: 2, three: 3, four: 4, five: 5 }, function(txt, val) {
select.append('<option value="' + val + '">' + txt + '</option>');
});
});
</script>
</head>
<body></body>
</html>
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

<form>
<input type="hidden" name="selval">
<select onchange="this.form.selval.value=this.selectedIndex">
<option>val1</option>
<option>val2</option>
</select>
</form>

czysty javascript w formie
Anonimowy użytkownik

Anonimowy użytkownik

Potwierdzenie od:

$(function() {
$('#myselect').change(function() {
$('#myhidden').val =$("#myselect option:selected").text();
});
});

Aby odpowiedzieć na pytania, Zaloguj się lub Zarejestruj się