Javascript, если еще в документе готовой функции

Question

новичок в JavaScript ищу, если еще в документе готовой функции

мой HTML код

<form> 
    <input type="radio" name="hanu" id="Male" value="1" checked/> Male 
    <input type="radio" name="hanu" id="Female" value="2" /> Female 
</form> 

Теперь я ищу JavaScript, который мы можем запустить, если мы выбираем мужская необходимость выполнять некоторые функции на изменения, если мы выбираем женскую необходимость выполнения какого-либо другое на функции изменения

if (document.getElementById('Male').checked){ 
//some first change function 
} else { 
//some second change function 
} 

теперь проблема с утром в состоянии получить первую функцию изменения нет т возможность второй функции изменения

Answer 1

Метод, предложенный Рори, абсолютно корректен. Это еще один метод с использованием Jquery.I вызывает функции каждый раз, когда нажимается эта опция.

$(document).ready(function(){ 
    $("#Male").on('click',function(){ 
    alert("Male"); 
    }); 
    $("#Female").on('click',function(){ 
    alert("Female"); 
    }); 
    }); 

Вот рабочая demo

В качестве альтернативы, вы можете также использовать класс по функции изменения, как Рори указал.

HTML

<input type="radio" class="gender" name="hanu" id="Male" value="1" checked/> Male 
<input type="radio" class="gender" name="hanu" id="Female" value="2" /> Female 

JQuery

$(".gender").on('change',function(){ 
    alert("changed"); 
    }); 

Вот рабочая demo

Answer 2

document.ready вызывается только первый раз, когда страница загружается, чтобы получить это снова и снова, вы должны перенести его на другой функции, кроме document.ready

Answer 3

Проблема в том, что документ Обработчик .ready выполняется только один раз в жизненном цикле страницы (при загрузке). Таким образом, прослушивание Javascript не выполняется, когда вы меняете флажки. Для этого нужно подключиться к событию change. Попробуйте это:

$(function() { 
    $(':checkbox').change(function() { 
     if ($(this).val() == '1') { 
      // Male selected, do something... 
     } else { 
      // Female selected, do something else... 
     } 
    }).change(); // trigger a change so this code also runs on load 
}); 

Селектор :checkbox может быть слишком общим для вашего фактического кода производства, я просто использовал его в качестве примера. Я бы предложил вам изменить его на нечто более конкретное, возможно, используя класс.

Answer 4

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

Вы должны связать событие изменения для элементов:

$(document).ready(function() { 
    $('input[type="radio"]').change(function() { 
     if ($(this).is(':checked') && $(this).attr('id') == 'Male') { 
      //do something 
     } else if ($(this).is(':checked') && $(this).attr('id') == 'Female') { 

     } 
    }); 
}) 

Answer 5

Это должно дать вам идею без JQuery:

document.getElementById('Male').onclick = function(){ 
alert('male clicked!'); 
} 

вы связывание события OnClick элемента к яваскрипту функции который предупреждает строку ...

Answer 6

Чистый JavaScript решение, и я настоятельно рекомендую использовать форму события, а не вход, дать ему имя, добавить слушатель события

document.myform.onchange = function(event){ 
 
    alert(event.target.value); 
 
}

<form name="myform"> 
 
    <input type="radio" name="hanu" id="Male" value="1" checked/> Male 
 
    <input type="radio" name="hanu" id="Female" value="2" /> Female 
 
</form>