在每個循環中自動分割字符串 - jquery

我有以下jQuery代碼循環返回的json數據，出於某種原因它是分割郊區的空間分配爲值時，而不是作爲文本，我無法弄清楚爲什麼會發生這種情況。在每個循環中自動分割字符串 - jquery

我的代碼

$.each(data , function(index, obj) { 
        $.each(obj, function(key, value) { 
         var suburb = $.trim(value['mcdl01']); 
         var number = $.trim(value['mcmcu']); 
         $("#FeedbackBranchName").append("<option value=" + suburb + ">" + suburb + " (" + number + ")</option>"); 
        }); 
       });

樣品返回的結果

<option **value="AIRLIE" beach=""**>AIRLIE BEACH (4440)</option> 
<option value="ASHMORE">ASHMORE (4431)</option> 
<option **value="BANYO" commercial=""**>BANYO COMMERCIAL (4432)</option> 
<option value="BEENLEIGH">BEENLEIGH (4413)</option> 
<option value="BERRIMAH">BERRIMAH (4453)</option> 
<option **value="BOWEN" hills=""**>BOWEN HILLS (4433)</option>

注意如何爲AIRLEE BEACH，班約區COMMERICAL和BOWN HILLS的第二個字已經從價值屬性中分離出來，但它在很好文本級別。

任何人都知道爲什麼會發生這種情況？

感謝

來源

2013-07-01 sluggerdog

如果HTML屬性的值包含空格，該值必須用引號引起來。否則，瀏覽器不知道什麼是價值的一部分，什麼是屬性。 –

只是包裝你的屬性值是引號，以便它的一部分（在空格之後）不被視爲新屬性。

$("#FeedbackBranchName").append("<option value='" + suburb + "'>" + suburb + " (" + number + ")</option>"); 
               ^_________________________________

更好地使用jquery元素的構造函數。

$("#FeedbackBranchName").append($('<option/>', { 
    value: suburb, 
    text: suburb + " (" + number + ")" 
}));

來源

2013-07-01 23:07:44 PSL

爲什麼downvote？請擴展... – PSL

+1正準備推薦您提供的第二種語法。不知道爲什麼有人會DV這個答案。 –

@瘋狂火車不知道...... :(是的，我在第二個語法中輸入了...... :) – PSL

這是因爲你不包括周圍的value屬性引號。

所產生的實際HTML是這樣的：

<option value=AIRLIE BEACH>AIRLIE BEACH (4440)</option>

這是越來越由瀏覽器解釋是這樣的：

<option value="AIRLIE" BEACH="">AIRLIE BEACH (4440)</option>

爲了解決這個問題，你可以在這樣的報價包裹的價值：

$("#FeedbackBranchName") 
    .append('<option value="' + suburb + '">' + suburb + " (" + number + ")</option>");

或者更好的是，使用jQuery來設置值而不是將HTML構建爲一個字符串：

$("#FeedbackBranchName").append(
    $("<option />") 
     .val(suburb) 
     .text(suburb + ' (' + number + ')') 
);

來源

2013-07-01 23:07:42 jcsanyi

一般來說創建新的HTML元素時，最好讓jQuery的做適當的轉義爲您提供：

$.each(obj, function(key, value) { 
    var suburb = $.trim(value['mcdl01']), 
    number = $.trim(value['mcmcu']); 

    $("#FeedbackBranchName").append($("<option/>", { 
     value: suburb, 
     text: suburb + " (" + number + ")" 
    })); 
});

您也可以使用Option構造：

$("#FeedbackBranchName") 
    .append(new Option(suburb + " (" + number + ")", suburb));

來源

2013-07-01 23:10:19

在每個循環中自動分割字符串 - jquery

回答

相關問題