2015-11-19 3 views
3

Привет, я в основном пытаюсь отключить другое поле ввода, если день установлен на сегодняшний день из другого поля ввода (даты). Я не могу заставить меня переключиться на поле ввода и захватить это значение в переменную, чтобы сделать эту работу.Как получить значение от onchange?

У меня был успех, помещая onchange (this) в поле ввода, но я должен вытащить его и вместо этого включить JS onchange.

Я пробовал следующий код. Как вы можете видеть, он должен сделать что-то, когда время прошло 10 утро и дата выбрана, как сегодня:

<script> 
    var date = new Date(); 
    var dd = date.getDate(); 
    var mm = date.getMonth()+1; 
    var yyyy = date.getFullYear(); 
    var hrs = date.getHours(); 

    if(dd<10) { 
     dd='0'+dd 
    } 

    if(mm<10) { 
     mm='0'+mm 
    } 

    date = yyyy+'-'+mm+'-'+dd; 


    var userDateEntry = document.getElementById("fm_deliverydate").onchange().value; 

    if (hrs >= 10 && userDateEntry == date) { 
     alert("Shipping for today has ended. Your order will arrive tomorrow"); 
     document.getElementById('fm_deliverytime').disabled= true; 
    } 
    else{ 
     document.getElementById('fm_deliverytime').disabled= false; 
    } 
</script> 

<input type="date" name="DateName" id="fm_deliverydate" /> 

<input type="time" name="TimeName" id="fm_deliverytime" /> 
+2

Где вы добавление 'change' слушателя? Где вызывается «dateEntered»? Как написано, этот код не имеет смысла. – Mathletics

+0

Да, я не вижу отношения между 'dateEntered()' и вашими элементами ввода. Как вы регистрируете обработчик 'onchange'? Нам не хватает некоторых ключевых элементов вашего кода. – Amy

+0

У меня изначально был метод dateEntered() во входе onchange, который я вынул. Я забыл об использовании этой функции в скрипте! –

ответ

2

Вы не крепление события правильно. Вы присоединяете событие, используя addEventListener.

Fiddle: http://jsfiddle.net/AtheistP3ace/125jnvwp/1/

var date = new Date(); 
var dd = date.getDate(); 
var mm = date.getMonth() + 1; 
var yyyy = date.getFullYear(); 
var hrs = date.getHours(); 

if (dd < 10) { 
    dd = '0' + dd 
} 

if (mm < 10) { 
    mm = '0' + mm 
} 

date = yyyy + '-' + mm + '-' + dd; 

var userDateEntry = document.getElementById("fm_deliverydate"); 
userDateEntry.addEventListener('change', 
    function() { 
     if (hrs >= 10 && userDateEntry.value == date) { 
      alert("Shipping for today has ended. Your order will arrive tomorrow"); 
      document.getElementById('fm_deliverytime').disabled = true; 
     } else { 
      document.getElementById('fm_deliverytime').disabled = false; 
     } 
    } 
); 
0

Попробуйте добавить прослушиватель событий к элементу вместо этого, и обжига вашей функции, когда она меняется. Попробуйте это на jsFiddle. Вы также можете рассмотреть вопрос о добавлении случая, когда введенная дата ниже текущей. На данный момент вы можете ввести дату в прошлом и все еще иметь возможность ввести время.

<input type="date" name="DateName" id="fm_deliverydate" /> 
<input type="time" name="TimeName" id="fm_deliverytime" /> 

<script> 
var date = new Date(); 
var dd = date.getDate(); 
var mm = date.getMonth()+1; 
var yyyy = date.getFullYear(); 
var hrs = date.getHours(); 

if(dd<10) { 
    dd='0'+dd 
} 

if(mm<10) { 
    mm='0'+mm 
} 

date = yyyy+'-'+mm+'-'+dd; 

(function(){ 
    document.getElementById("fm_deliverydate").onchange = function() { 
     dateEntered(); 
    } 
})(); 

function dateEntered(){ 
    var userDateEntry = document.getElementById("fm_deliverydate").value; 

    if (hrs >= 10 && userDateEntry == date) { 
     alert("Shipping for today has ended. Your order will arrive tomorrow"); 
     document.getElementById('fm_deliverytime').disabled= true; 
    } 
    else{ 
     document.getElementById('fm_deliverytime').disabled= false; 
    } 
} 
</script> 
1

Если вы хотите добавить слушатель OnClick события в HTML, то вам действительно нужно только удалить OnChange метода вы прикрепленный в вашей dateEntered функции и переместить его в HTML, ничего другого изменение тогда.

var date = new Date(); 
var dd = date.getDate(); 
var mm = date.getMonth()+1; 
var yyyy = date.getFullYear(); 
var hrs = date.getHours(); 

if(dd<10) { 
    dd='0'+dd 
} 

if(mm<10) { 
    mm='0'+mm 
} 
date = yyyy+'-'+mm+'-'+dd; 

function dateEntered(){ 
    var userDateEntry = document.getElementById("fm_deliverydate").value; 

    if (hrs >= 10 && userDateEntry == date) { 
     document.getElementById('fm_deliverytime').disabled = true; 
    } else { 
     console.log('shipping enabled'); 
     document.getElementById('fm_deliverytime').disabled = false; 
    }; 
} 

Ваш HTML будет выглядеть следующим образом:

<input onchange="dateEntered()" type="date" name="DateName" id="fm_deliverydate" placeholder="yyyy-mm-dd"/> 

<input type="time" name="TimeName" id="fm_deliverytime" placeholder="enter date"/> 

Вот скрипка: https://jsfiddle.net/o73fze9r/

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