2015-04-20 4 views
0

Я хочу, чтобы это текстовое поле включалось, когда я выбираю определенное значение из раскрывающегося списка, и отключается, когда я выбираю любую другую опцию.Включить/отключить поле ввода на основе выбора

Это мой HTML:

<select name="status" id ="combo"> 
     <option value="_">Please choose..</option> 
     <option value="Pending">Pending</option> 
     <option value="Process">Process</option> 
     <option value="Delivered" >Delivered</option> 
     </select> 
<tr valign="baseline"> 
<td nowrap="nowrap" align="right" class="postage" >Postage:</td> 
<input type="text" name="postage" id="textbox" > 
+0

Для этого вам нужна библиотека javascript или javascript с именем jquery :-) Я могу написать вам скрипт. – Redrif

+6

Можете ли вы показать, что вы делали до сих пор? Постскриптум Это недействительный HTML. У вас не может быть ' 'как дочерний элемент' ' – CodingIntrigue

+0

@Redrif Добавление jQuery в проект для простой задачи под рукой избыток. Плохо советовать людям «добавить jQuery» в качестве решения каждой проблемы. jQuery замечательный, я использую его в своих проектах, когда это необходимо, но добавление его должно быть решением, которое вы принимаете на основе всего проекта и целевых платформ развертывания. Мы просто не располагаем достаточной информацией, чтобы сделать такое предложение. jQuery - это тысячи строк кода, добавляя его, чтобы сделать одну базовую задачу, как использование бензопилы, чтобы вырезать торт ко дню рождения. –

ответ

2

Попробуйте это:

var select_element = document.getElementById("combo"); 
var selected = select_element.options[ select_element.selectedIndex ].value 

if(selected == "Delivered"){ 
    document.getElementById("textbox").disabled = false; 
}else{ 
    document.getElementById("textbox").disabled = true; 
} 
0

Я видел оригинальное название с JQuery, но кто-то редактировал. Во всяком случае просто упаковывают вы задавались вопросом, как это делается в JQuery здесь:

$(document).ready(function() { 
     var $input = $('input[name=postage]'); 
     $input.attr('disabled', 'disabled'); 
     $('select[name=status]').on('change', function() { 
      $input.attr('disabled', $(this).val() != "Delivered"); 
     }); 
    }); 

демо: http://jsfiddle.net/c4rks52r/

+1

Как отметил Крис Бейкер, пользователь не указал на доступ к jQuery. Кроме того, я считаю, что вы должны использовать prop сейчас, а не attr. –

+0

@ScottSmith На самом деле, я только что видел историю редактирования, кто-то взял слово «jQuery» из названия без добавления тега. Если marcel хочет восстановить его ответ, я отступлю свой downvote. –

+0

Ах, хороший улов, не видел этого. –

0

Это было бы, как я хотел бы сделать это с помощью JQuery (demo here):

$(document).on('change', '#combo', function(){ 
    var shouldEnable = $(this).val() !== 'Delivered'; 
    $('#textbox').prop('disabled', shouldEnable); 
}); 

Примечание стороны , вы когда-либо говорили конкретно, какая ценность выбрана, это триггер для включения? Я просто пошел с Delivered, поскольку все остальные пошли по этому маршруту. Может быть, я пропустил, где вы сказали это явно. Кроме того, на основе вашего описания о том, когда выбрано определенное значение, я предполагаю, что вы захотите его сначала отключить, когда страница загрузится. Моя демонстрация имеет это место.

Смежные вопросы