Easyui的输入框如何设置placeholder

最新推荐文章于 2021-07-12 11:49:23 发布

转载最新推荐文章于 2021-07-12 11:49:23 发布 · 1k 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://my.oschina.net/u/2331760/blog/847810

文章标签：

#javascript #ViewUI

本文介绍了一种在EasyUI的输入框中实现动态提示的方法。通过定义隐藏框并使用JavaScript来延迟设置输入框的placeholder属性，实现了输入框提示信息的动态变化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

2019独角兽企业重金招聘Python工程师标准>>>

思路:在easyui的输入框上定义隐藏框,然后根据隐藏框的值延迟设定easyui的输入框的placeholder

<table class="table" style="width: 100%;">				 
     <tr> 
          <th>最小值（￥）>=</th>
          <td>
               <s:hidden id="message1" value="大于等于下限" theme="simple"/>
               <s:textfield name="object.moneyLower" theme="simple"  cssClass="easyui-numberbox" data-options="required:true,placeholder:333" />
          </td>
     </tr>                         
     <tr> 
          <th>最大值（￥）<=</th>
          <td>
               <s:hidden id="message2" value="小于等于上限" theme="simple"/>
               <s:textfield name="object.moneyUpper" theme="simple" cssClass="easyui-numberbox" data-options="required:true" />
          </td>
     </tr>                                               
</table>

JS:

$(function() {
	window.onload = numberInputPlaceholder();
});

/**
* 定义提示框的显示
*/
function numberInputPlaceholder(){
	setTimeout(function(){
		$(".easyui-numberbox").each(function(i){
			var messageInput = $(this).prev('input');
			var messageVal = messageInput.val();
			var targetInput =this;
			if(targetInput){
				$(targetInput).attr("placeholder", messageVal);
			}
		});
	},10);
}

效果图: