>  기사  >  웹 프론트엔드  >  입력 상자와 드롭다운 상자 간의 연결 효과 실현

입력 상자와 드롭다운 상자 간의 연결 효과 실현

php中世界最好的语言
php中世界最好的语言원래의
2018-03-15 09:55:513621검색

이번에는 입력박스와 드롭다운 박스의 연계효과를 구현하기 위한 주의사항과, 입력박스와 드롭다운박스의 연계효과를 구현하기 위한

주의사항

에 대해 알려드리겠습니다. 다음은 실제 사례입니다. 살펴보겠습니다. 그림에 표시된 대로:

html code

<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[&#39;material_id&#39;]}">{$value['material_name']}</option>
   {/foreach}
  </select>
 </td>
</tr>

JQuery code

<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=&#39;"+key+"&#39;>"+obj[key]+"</option>"; 
      reward_id.append(option); 
     }
     } 
   } 
 });
 } 
</script>
PHP code

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);
}

믿으세요 이 기사의 사례를 읽으신 후 방법을 마스터하셨다면, 더 많은 PHP 중국어 웹사이트의 다른 관련 기사도 주목해주세요!

추천 자료:
Jquery 드롭다운 상자에서 동적으로 데이터를 얻는 방법


Ajax와 Jquery는 데이터베이스와 결합하여 드롭다운 상자를 구현하는 보조 연결을 만듭니다.


jQuery 구현 재귀 무한 레이어 기능


jquery는 선택 태그의 값과 텍스트를 가져옵니다

🎜🎜

위 내용은 입력 상자와 드롭다운 상자 간의 연결 효과 실현의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.