day04_表单提交方式

1.表单提交方式(三种)
*使用submit提交

    <form>
        .....
        <input type="submit">       
   </form>

*使用button提交

    function form1() {
        //获取form
        var form1 = document.getElementById("form1");
        //设置action
        form1.action = "exe1.html";
        //提交form表单
        form1.submit();
    }

*使用超链接提交

<a href="exe1.html?username=123456">使用超链接提交</a>

四个重要属性:考虑到兼容性问题
onclick:鼠标点击事件
onchange:改变内容(通常用在select中)
onfocus:得到焦点(ie5\某些版本的ie6,由于兼容性问题,效果不好 )
onblur:失去焦点

    //输入框内默认值的焦点事件
    function focus1() {
        var text1 = document.getElementById("id1");
        text1.value="";
    }
    function blur1() {
        var text2 = document.getElementById("id1");
        text2.value="see you";
    }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
可以使用JavaScript来实现这个功能。首先,在HTML页面中创建一个表单,让用户可以输入当前时间: ```html <form> <label for="time">请输入当前时间:</label> <input type="text" id="time" name="time"> <button type="submit">提交</button> </form> ``` 然后,在JavaScript中获取用户输入的时间,并根据时间来显示不同的图片: ```javascript // 获取表单元素和图片元素 const form = document.querySelector('form'); const dayImg = document.querySelector('#day-img'); const nightImg = document.querySelector('#night-img'); // 监听表单提交事件 form.addEventListener('submit', (event) => { event.preventDefault(); // 阻止表单默认提交行为 // 获取用户输入的时间 const timeInput = document.querySelector('#time'); const time = timeInput.value; // 将时间字符串转换为Date对象 const date = new Date(`2000-01-01T${time}`); // 获取当前时间的小时数 const hour = date.getHours(); // 根据小时数判断是白天还是黑夜 if (hour >= 6 && hour < 18) { // 显示白天图片 dayImg.style.display = 'block'; nightImg.style.display = 'none'; } else { // 显示黑夜图片 dayImg.style.display = 'none'; nightImg.style.display = 'block'; } }); ``` 在HTML中,需要为白天和黑夜图片分别创建img元素,并设置它们的display样式为none,初始状态下不显示任何图片: ```html <img id="day-img" src="day.jpg" style="display:none;"> <img id="night-img" src="night.jpg" style="display:none;"> ``` 注意,这里假设白天图片的文件名为day.jpg,黑夜图片的文件名为night.jpg,需要根据实际情况修改。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值