無法修改/操縱來自動態PHP表單的Ajax / JSON響應中的動態內容

Question

我需要一個動態的表單，它應該像這樣工作：

1. 當用戶按下“ ADD”按鈕時，出現一個新的.. <。div> DOM以選擇一個程序包。
2. 根據包裝的不同，該行必須更改顏色（通過添加/刪除某些類）。

但是我無法正常工作。 這是我的HTML：

<button onclick='addDay();'>
<div class='content'>
</div>

我的Javascript：

//FUNCTION 1: LOAD AJAX CONTENT
function addDay()
{
    baseUrl = $('input#helper-base-url').val();

    //Set caching to false
    $.ajaxSetup ({
        cache: true
    });

    //Set loading image and input, show loading bar
    var ajaxLoad = "<div class='loading'><img src='"+baseUrl+"assets/images/loading.gif' alt='Loading...'  /></div>";
    var jsonUrl = baseUrl+"car/add_day/"+count;
    $("div#loading").html(ajaxLoad);
    $("div#content").hide();
    $.getJSON(
        jsonUrl,
        {},
        function(json)
        {
                temp = "";

            if(json.success==true)
            {
                temp = json.content;
            }

            //Display the result
            $("div#content").show();
            $("div#content").html($("div#content").html()+temp);
            $("div#loading").hide();
          });
}

//FUNCTION 2: MODIFY AJAX CONTENT
$("#content").on("change", "select.switch", function (e) {

e.preventDefault();

//Get which row is to be changed in background's color
id = this.id;
id = id.substr(6);

//Add class "package1" which change row's background color
row = "row"+id;
row.addClass('package1');

}）;

我的PHP

function add_day($count)
{
    $temp = "<div class='row".$count."'>
        <select id='switch".$count."' class='switch'>
        <option value='1'>Package 1</option>
        <option value='2'>Package 2</option>
        </select>
    </div>";

    $result = array(
        'success' => true,
        'content' => $temp,
        );

    $json = json_encode($result);
    echo $json;
}

PS。 表單並非如此簡單，但是為了使問題解決更加容易，我刪除了細節。 但我似乎無法即時更改課程。 在這附近，我們有解決方案還是好的工作？

編輯1：對不起，我之前並沒有明確表態。 我獲取ID或變量沒有問題（沒關系，當我警告它時會顯示正確的值-但添加類后，看不到顏色變化）。 我運行它：

一種。 單擊按鈕后，加載Ajax內容。

b。 Ajax內容（結果包含）已成功加載。

C。 失敗：更改后，將類“ package1”添加到div行。 （因此，獲取正確的ID或類名沒有問題。當我警告變量給出正確的結果時，顏色不會改變。我無法檢查類是否已成功添加。）

Answer 1

$("#content").on("change", "select.switch", function (e) {
    e.preventDefault();

    $('.row' + $(this).attr('id').replace('switch', '')).addClass('package1');
});

Answer 2

假設其他一切都OK

//Get which row is to be changed in background's color
id = this.id;
id = id.substr(6);

//Add class "package1" which change row's background color
row = "row"+id;
row.addClass('package1');

這就是問題。 要獲得禮節身份證，您必須做

var id = $(this).attr('id').substr(6);

您必須使用$(this)而不是this來使用所有jQuery功能。

下同

$(row).addClass('package1');

因此，完整代碼：

//Get which row is to be changed in background's color
var id = $(this).attr('id').substr(6);

//Add class "package1" which change row's background color
$('.row'+id).addClass('package1');

Answer 3

將類更改為id可解決問題（使用＃row0而不是.row0）。 對不起，謝謝您的時間:)