html5 绑定js js绑定onchange_deanyuancn的技术博客_

link之家

链接快照平台

输入网页链接，自动生成快照
标签化管理网页链接

当id 为action的select 标签发生改变时，执行handleChange() 方法

select id="action" onchange="handleChange()"

<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <title>Title</title>
</head>
    <form action="/upload" method="post" enctype="multipart/form-data">
    <input type="hidden" style="display: none" placeholder="id" name="announcement_id" value="{{ announcement.id }}" >
    <input type="text" size="60" value="{{ announcement.name }}" disabled>
    <textarea style="width: 431px; height: 343px" disabled> {{ announcement.content }}</textarea>
    <span>变更结束时间：</span><input id="end_time" disabled type="datetime-local" name="end_time" value="now" >
    <select id="action" onchange="handleChange()" name="select" style="width: 392px;">
        <option  value="over">变更结束</option>
        <option  value="delay">推迟结束时间</option>
    </select>
    <button type="submit" value="提交">提交</button>
</form>
<script>
    // 选择select 后触发动作
    function handleChange() {
    var obj = document.getElementById('action'); // 定位id
    var index = obj.selectedIndex; // 选中索引
    var value = obj.options[index].value; // 选中值
        if (value == "delay" )(
            document.getElementById("end_time").value= {{ announcement.end_time }}
        )else if (value == "over" )(
            document.getElementById("end_time").value=now
    {#alert(value);#}
</script>
</body>
</html>