归纳一下input中span提示以及input中onchange事件

一、当input中不含有onclick事件的时候

定义一个class为tip1的span:

<td><input  type=text name='POSTNAME' nameVal='POSTCODE'  required='required' οnchange='showtips()'>

  <span class='tip1'></span>

</td>

js中加载提示内容:这个提示只限于postname为空的时候

  if($(this).find('input[name="POSTNAME"]').val() == ""){
    tip1.html('<font color="red">岗位不能为空!</font>');
  }

效果:

 

那么问题来了,我们怎么在填入信息的同时这个tip就隐藏了呢:

看下边函数:

  function showtip(){
    if($(this).find('input[name="POSTNAME"]').val() != ""){
      $(".tip1").hide();
    }
  }

这样就ok了,效果

二、由于个人尝试,发现onclick事件与onchange并不能共存,也就是说input中含有onclick的时候,input的监听onchange不起作用,比如:

<td><input οnclick='openfunction()'  type=text name='POSTNAME' nameVal='POSTCODE'  required='required' οnchange='showtips()'>

  <span class='tip1'></span>

</td>

那么这个时候我们就不必要在input中加入 οnchange='showtips()'事件了,我的操作是吧showtips()中的代码写到了onclick的方法中,完美解决!

转载于:https://www.cnblogs.com/Sophias/p/6761125.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在HTML,`onchange`是一个事件属性,它在用户改变输入框的值并且失去焦点时触发。该事件可以用于执行一些处理逻辑,比如验证输入的有效性或者触发其他操作。引用的代码演示了一个使用`onchange`事件的例子,当输入框的值发生改变时,会在控制台打印出输入框的值。 另一种方法是使用`addEventListener`方法来绑定`input`事件,如引用所示。`input`事件在每次输入框的值发生改变时触发,而不需要等到失去焦点。这意味着用户每输入一个字符或删除一个字符,都会触发`input`事件。这与`onchange`事件的区别在于触发时机的不同。如果您希望在用户每次输入时立即做出反应,可以使用`input`事件。 您提到的引用演示了一个使用`onchange`事件的实例,当输入框的值发生改变时,会调用函数`a`并将输入框本身作为参数传递给函数。这个例子说明了`onchange`事件可以用于调用自定义函数,并将相关信息传递给该函数。 总结来说,`onchange`事件在输入框的值发生改变并且失去焦点时触发,而`input`事件在每次输入框的值发生改变时立即触发。您可以根据具体的需求选择使用哪个事件来处理输入框的改变。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [inputonchange事件实际触发条件与解决方法](https://blog.csdn.net/qq_42066649/article/details/102494428)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* [input元素的oninput事件onchange事件](https://blog.csdn.net/XuM222222/article/details/88703470)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值