Heim >Backend-Entwicklung >PHP-Tutorial >javascript – So ändern Sie die dynamische Auswahl in ein UL-Navigationsformular. Bitten Sie um Führung.

javascript – So ändern Sie die dynamische Auswahl in ein UL-Navigationsformular. Bitten Sie um Führung.

WBOY
WBOYOriginal
2016-09-11 11:34:211181Durchsuche

Sehen Sie sich den Code an.

<code>     <!-- 大系列 -->
            <td style="visibility: hidden;">{$lang.big_series}<select name="big_cate_id" id="big_cate_id">
                    <option value="">{$lang.please_select}</option>
                    {foreach from=$big_series item=big}<option value="{$big.sapval}" rel="{$big.cat_id}">{$big.cat_name}</option>{/foreach}
                </select>
            </td>
        </tr>                    
            <!-- 小系列 -->
           <!-- <td>{$lang.sub_series}<select name="sub_cate_id" id="sub_cate_id" onchange="searchGoods();">
                    <option value="">{$lang.please_select}</option>
                    {foreach from=$sub_series item=sub}<option value="{$sub.sapval}" class="s{$sub.parent_id}">{$sub.cat_name}</option>{/foreach}
                </select>
            </td>                                     -->
            <!-- 商品号or商品名 -->
        <tr>
            <td align="center">
                <input type="text" name="keyword" size="15" placeholder="产品名(号)" style="height:19px;line-height:19px;" />
                <input type="submit" value="搜索产品" class="button" />
            </td>
        </tr>
        <tr>
            <td>{$lang.sub_series}<select name="sub_cate_id" id="sub_cate_id" onchange="searchGoods();" size="20">
                  
                    {foreach from=$sub_series item=sub}<li value="{$sub.sapval}" class="s{$sub.parent_id}">{$sub.cat_name}</li>{/foreach}
                    
                </select>
            </td> 
        </tr>
 
 
 $(document).ready(function(){
    $('#big_cate_id').change(function(){
        var sapval = $(this).val();
        var cat_id = 0;
        $(this).find('option').each(function(){
            if($(this).attr('value') == sapval){
                cat_id = $(this).attr('rel');
            }
        });
        $('#sub_cate_id').empty();
        $('#sub_cate_id').append('<option value="">{$lang.please_select}</option>');
        if(sapval == ''){
            for(var i=0,len=subcate.length; i<len; i++){
                $('#sub_cate_id').append("<option value='"+ subcate[i].sapval +"'>" + subcate[i].cat_name + "</option>");
            }
        }else{
            for(var i=0,len=subcate.length; i<len; i++){
                if(subcate[i].parent_id == cat_id){
                    $('#sub_cate_id').append("<option value='"+ subcate[i].sapval +"'>" + subcate[i].cat_name + "</option>");
                }
            }
        }
    });
});
{/literal}
listTable.recordCount = {$record_count};
listTable.query = 'list';
listTable.pageCount = 1;
{foreach from = $filter item = item key = key}
listTable.filter.{$key} = '{$item}';
{/foreach}
  function searchGoods() {
    listTable.filter['big_cate_id'] = document.forms['searchForm'].elements['big_cate_id'].value;
    listTable.filter['sub_cate_id'] = document.forms['searchForm'].elements['sub_cate_id'].value;
    listTable.filter['keyword'] = Utils.trim(document.forms['searchForm'].elements['keyword'].value);
    listTable.filter['src'] = '{$src}';
    listTable.loadList();
}

![图片描述][1]
</code>

javascript – So ändern Sie die dynamische Auswahl in ein UL-Navigationsformular. Bitten Sie um Führung.

Antwortinhalt:

Sehen Sie sich den Code an.

<code>     <!-- 大系列 -->
            <td style="visibility: hidden;">{$lang.big_series}<select name="big_cate_id" id="big_cate_id">
                    <option value="">{$lang.please_select}</option>
                    {foreach from=$big_series item=big}<option value="{$big.sapval}" rel="{$big.cat_id}">{$big.cat_name}</option>{/foreach}
                </select>
            </td>
        </tr>                    
            <!-- 小系列 -->
           <!-- <td>{$lang.sub_series}<select name="sub_cate_id" id="sub_cate_id" onchange="searchGoods();">
                    <option value="">{$lang.please_select}</option>
                    {foreach from=$sub_series item=sub}<option value="{$sub.sapval}" class="s{$sub.parent_id}">{$sub.cat_name}</option>{/foreach}
                </select>
            </td>                                     -->
            <!-- 商品号or商品名 -->
        <tr>
            <td align="center">
                <input type="text" name="keyword" size="15" placeholder="产品名(号)" style="height:19px;line-height:19px;" />
                <input type="submit" value="搜索产品" class="button" />
            </td>
        </tr>
        <tr>
            <td>{$lang.sub_series}<select name="sub_cate_id" id="sub_cate_id" onchange="searchGoods();" size="20">
                  
                    {foreach from=$sub_series item=sub}<li value="{$sub.sapval}" class="s{$sub.parent_id}">{$sub.cat_name}</li>{/foreach}
                    
                </select>
            </td> 
        </tr>
 
 
 $(document).ready(function(){
    $('#big_cate_id').change(function(){
        var sapval = $(this).val();
        var cat_id = 0;
        $(this).find('option').each(function(){
            if($(this).attr('value') == sapval){
                cat_id = $(this).attr('rel');
            }
        });
        $('#sub_cate_id').empty();
        $('#sub_cate_id').append('<option value="">{$lang.please_select}</option>');
        if(sapval == ''){
            for(var i=0,len=subcate.length; i<len; i++){
                $('#sub_cate_id').append("<option value='"+ subcate[i].sapval +"'>" + subcate[i].cat_name + "</option>");
            }
        }else{
            for(var i=0,len=subcate.length; i<len; i++){
                if(subcate[i].parent_id == cat_id){
                    $('#sub_cate_id').append("<option value='"+ subcate[i].sapval +"'>" + subcate[i].cat_name + "</option>");
                }
            }
        }
    });
});
{/literal}
listTable.recordCount = {$record_count};
listTable.query = 'list';
listTable.pageCount = 1;
{foreach from = $filter item = item key = key}
listTable.filter.{$key} = '{$item}';
{/foreach}
  function searchGoods() {
    listTable.filter['big_cate_id'] = document.forms['searchForm'].elements['big_cate_id'].value;
    listTable.filter['sub_cate_id'] = document.forms['searchForm'].elements['sub_cate_id'].value;
    listTable.filter['keyword'] = Utils.trim(document.forms['searchForm'].elements['keyword'].value);
    listTable.filter['src'] = '{$src}';
    listTable.loadList();
}

![图片描述][1]
</code>

javascript – So ändern Sie die dynamische Auswahl in ein UL-Navigationsformular. Bitten Sie um Führung.

Das Select-Tag hat das Attribut size

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn