如何从onchange获得价值?

时间:2015-11-19 19:14:47

标签: javascript date 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" />

3 个答案:

答案 0 :(得分:2)

您没有正确附加活动。您使用addEventListener附加活动。

小提琴: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;
        }
    }
);

答案 1 :(得分:1)

如果你想将onclick事件监听器添加到html中,那么你真的只需要删除你在dateEntered函数中附加的onchange方法并将其移动到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/

答案 2 :(得分: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>