实时监控input框,实现输入框与下拉框联动的实例
编程学习 2021-07-04 17:33www.dzhlxh.cn编程入门
狼蚁网站SEO优化长沙网络推广就为大家分享一篇实时监控input框,实现输入框与下拉框联动的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随长沙网络推广过来看看吧
如图：
html代码
<tr>
<th scope="row">奖励类型：</th>
<td><input value="" type="text" name="item" id="reward" style="width: 60px;height: 20px;" placeholder="输入关键字" />
<select name="reward_id" id="reward_id">
<option value="">---请选择---</option>
{foreach $reward as $value}
<option value="{$value['material_id']}">{$value['material_name']}</option>
{/foreach}
</select>
</td>
</tr>
JQuery代码
<script type="text/javascript">
$('#reward').bind('input propertychange', function() {reward();});
function reward()
{
var search = $("#reward").val();
$.ajax({
type:"get",
url:"/mall/config_commodity_info/search_commodity_info",
data:{search:search},
success:function(select){
var reward_id = $("#reward_id");
if (select) {
$("option",reward_id).remove();
var obj = JSON.parse(select);
for (var key in obj) {
var option = "<option value='"+key+"'>"+obj[key]+"</option>";
reward_id.append(option);
}
}
}
});
}
</script>
PHP代码
public function add_alms()
{
$reward = $this->materials->selReward();
$this->assign('reward',$reward);
return $this->fetch();
}
public function do_add_alms()
{
$data = Request::instance()->param();
$this->alms->addAlms($data);
}
以上这篇实时监控input框,实现输入框与下拉框联动的实例就是长沙网络推广分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持狼蚁SEO。