0

良い一日

リストオプションを含む動的に入力されるドロップダウンリストがあります。問題は、リストからオプションを選択すると、ツリー構造に表示されるように、テキストの左側にスペース ( ) が適用されることです。

現在、リストはツリー構造でスタイル設定されており、サーバー上の別の場所から呼び出されます。その中の間隔を変更することはできません。(t は木構造効果を形成するため)

以下の私のコードを見てください:

HTML

<select id="AreaTreeSelect" data-bind="value: RiskAssessment.AreaId"></select>

Jクエリ

               $.ajax({
                    url: "API/DataHandler.ashx?method=getareatree",
                    contentType: "application/json; charset=utf-8",
                    success: function (result) {
                        for (var i in result) {
                            var obj = result[i];

                            $("#AreaTreeSelect").append("<option value=\"" + obj.Id + "\">" + obj.Name + "</option>");

                        }
                    }
                });

これは、ブラウザにどのように入力されるかです:

<select id="AreaTreeSelect" data-bind="value: RiskAssessment.AreaId">
<option value="156">Ferrometals</option>
<option value="158">&nbsp;&nbsp;Admin &amp; Finance</option>
<option value="169">&nbsp;&nbsp;&nbsp;&nbsp;Warehousing</option>
<option value="170">&nbsp;&nbsp;&nbsp;&nbsp;Procurement</option>
<option value="171">&nbsp;&nbsp;&nbsp;&nbsp;Acounting</option>
<option value="855">&nbsp;&nbsp;&nbsp;&nbsp;Information Technology</option>
<option value="159">&nbsp;&nbsp;HR</option>
</select>

等...

オプションが選択され、選択ボックスに表示されているときにスペースを削除するにはどうすればよいですか?

4

2 に答える 2

1

このようにスペースをトリムしてみてください...

$("#AreaTreeSelect").append("<option value=\"" + obj.Id + "\">" + $.trim(obj.Name) + "</option>");
于 2013-02-07T14:38:32.707 に答える
1

多分これは試してみる価値があるかもしれません:

$('#AreaTreeSelect').change(function(){
    $(this).find('option.trimmed').each(function(){
        var padding = '';
        for(var i=0; i<$(this).data('numSpaces'); i++){
            padding += String.fromCharCode(160);
        }
        $(this).text(padding + $(this).text());
    })
    .removeClass('trimmed');
    var selOpt = $(this).find('option:selected');
    var numSpaces = selOpt.text().replace(/^(\s*).*/, '$1').length;
    selOpt
        .data('numSpaces', numSpaces)
        .text(selOpt.text().replace(/^\s*/g, ''))
        .addClass('trimmed');
});

アイデアは、すべての   を削除することです。現在選択されているオプションから削除されますが、パディングの量が記憶されており、別のオプションが選択されたときにパディングが復元されます。

明らかに、   の実際のシーケンスを保存できます。それらの数の代わりに、数行のコードを取り除きます。

ここで作業フィドルを参照してください:http://jsfiddle.net/aKGac/1/

このソリューションの明らかな欠点は、現在選択されているオプションが展開されたときにインデントなしでリストに表示されることです。

選択したオプションにインデントなし

于 2013-02-07T14:39:57.590 に答える