Простая функция JavaScript для включения кнопки? - PullRequest
1 голос
/ 12 мая 2011

К сожалению, я ничего не знаю о JavaScript, поэтому прости меня за такой любительский вопрос.

У меня есть форма с полями выбора и кнопкой рядом с каждым.Я отключил кнопку, и я хочу, чтобы кнопка была включена, когда пользователь выбирает что-то в флажке.

Это то, что у меня есть в данный момент, чтобы создать поле выбора и отключитькнопка.

<td style="width:125px;"><strong>Processor:</strong></td>
    <td style="width:420px;">
        <select class="custom-pc" name="processor">
            <option value=""></option>
                <?php
                $processor_query = @mysql_query("SELECT * FROM custom_pc_processor");
                while ($p_q = mysql_fetch_array($processor_query)) {
                    $id = $p_q['id'];
                    $name = $p_q['name'];
                    echo '<option value="'.$id.'">'.$name.'</option>';
                }
                ?>
        </select>
        <input name="processor_details" type="button" value="Details" disabled="disabled" />
    </td>

Ответы [ 8 ]

1 голос
/ 12 мая 2011

Я предлагаю jQuery для лучшей поддержки браузера (и простоты кодирования):

$(function() {
   $('.custom-pc').change(function() {
     $(this).next('input').removeAttr('disabled');
  });
});
1 голос
/ 12 мая 2011

Самое простое решение - добавить обработчик событий onchange к элементу select. Например (при условии, что ваши элементы находятся в form):

<select onchange="this.form['processor_details'].disabled = false;" ...(rest of code)
0 голосов
/ 12 мая 2011

попробуйте это (с jQuery v 1.6 )

$('select').change(function() {
    var op =$(this).val();
    if(op !=''){  
        $('input[name="processor_details"]').prop('disabled',false);
    }else{
        $('input[name="processor_details"]').prop('disabled', true);
    }      
});

DEMO

0 голосов
/ 12 мая 2011

Без jQuery достаточно следующего блока кода в нижней части вашего HTML-тела.

<script type="text/javascript">
 var ddl = document.getElementsByName('processor')[0];

 ddl.onchange = function () {

    document.getElementsByName('processor_details')[0].disabled = !this.value;

 };
</script>

Если вы собираетесь много заниматься веб-разработкой в ​​своей карьере, вам действительно нужно научитьсяJavaScript и DOM.W3Schools поможет, особенно в этой главе .

Я рекомендую изучить jQuery.Это сделает вашу жизнь в 1000 раз легче, а также сделает вас более привлекательным для пола по вашему выбору.

0 голосов
/ 12 мая 2011
  1. Используйте jQuery
  2. , например,

    $( ".custom-pc" ) . change(function(){
      if ( selid( "#idselect" ) )
      {
        $( "#button" )  . attr ( "enabled", "enabled"  ); 
      } 
    })
    

selid - функция, которая показывает идентификатор выбранного элемента.function selid (name) // получить выбранный идентификатор элемента select или false {var id = false;$ ("#" + name + "option: selected"). each (function () {id = $ (this) .val ();});вернуть идентификатор;};

Извините, возможно, его можно переписать, чтобы он был более эффективным.

PS.Также - смешивать PHP и JS, в таком вопросе, не очень хорошая идея :) Уверен :)

0 голосов
/ 12 мая 2011

Вы можете использовать как это

<td style="width:125px;"><strong>Processor:</strong></td>
<td style="width:420px;">
    <select class="custom-pc" id="processor" name="processor" onChange='UpdateButton()">
        <option value=""></option>
            <?php
            $processor_query = @mysql_query("SELECT * FROM custom_pc_processor");
            while ($p_q = mysql_fetch_array($processor_query)) {
                $id = $p_q['id'];
                $name = $p_q['name'];
                echo '<option value="'.$id.'">'.$name.'</option>';
            }
            ?>
    </select>
    <input id="processor_details" name="processor_details" type="button" value="Details" disabled="disabled" />
</td>

...

<

script>
function UpdateButton()
{
var bDisable;
if (document.getElementById ("processor").value == '') // change the condition if required.
 bDisable = true;
else
 bDisable = false;

document.getElementById ("processor_details").disabled = bDisable;

}
</script>
0 голосов
/ 12 мая 2011

Непроверенный, но с моей головы это должно работать.

// Give your form a name, I'm using myform.
// Add an event to the onchange of the <select>
document.myform.processor.onchange = function() {
    // Enable the button
    document.myform.processor_details.disabled = false;
};
0 голосов
/ 12 мая 2011

Вам нужно поместить одно событие onChange в поле выбора.

<select class="custom-pc" name="processor" onChange="return getEnable(this.form);">
            <option value=""></option>
                <?php
                $processor_query = @mysql_query("SELECT * FROM custom_pc_processor");
                while ($p_q = mysql_fetch_array($processor_query)) {
                    $id = $p_q['id'];
                    $name = $p_q['name'];
                    echo '<option value="'.$id.'">'.$name.'</option>';
                }
                ?>
        </select>

// Функция Javascript выглядит следующим образом.

function getEnable(frm){
  frm.processor_details.disabled = false;
  return true;
}

Спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...