如何在不更改其當前元素的情況下更改其文本？

Question

$.ajax({
    type: "GET",
    url: "my url" + x,
    datatype: "html",
    success: function(data){
        //alert(x);
         //var Content = data;
         var sendId ;
         var data = $.parseJSON(data);
         var jsonArray = data.result;

        // var data2 = $.parseJSON(jsonArray);
         var jsonArray3 = jsonArray.oilFilter;
         $.each(jsonArray3,function(i1,js2){
             var proname = js2.productName;
             var mrp = js2.mrp;
             var deliveryStatus = js2.deliveryStatus;
             var oilid = js2.productId;
             $(".oilid").val(oilid);
             $(".deliveryStatusOil").html(deliveryStatus);
             $(".mrpoil").html(mrp);
             $(".oilprodetail").html(proname);


         });

    <label id="oilprodetail" class="oilprodetail"></label><br/>
    <label id="mrpoil" class="mrpoil"></label><br/>
    <a onClick="ajax_cross(this);" id="oilid" class="oilid" >View</a>

如果您遍歷代碼，我將給id標簽為oilprodetail和mrpoil的標簽分配值，並且我也對oilid做同樣的事情，我的要求是將oilid值發送到標簽並在其中保留視圖，請幫忙嗎？ 我是ajax的新手。

在上面的圖片中，我需要在圖片的右側進行查看，但是當我發送數據時，它會更改為圖片的左側，就像它從視圖更改為發送的值一樣

Answer 1

您可以使用data屬性將innerHTML保留為“ a”標簽。 喜歡 ：

$(".oilid").attr('data-oilid',oilid);

Answer 2

您的代碼有幾個問題：

• 您拼寫錯誤的datatype ，應該是dataType ；
• 即使拼寫正確，您也會錯誤地將數據類型標識為HTML：您確實期望JSON，這是不同的；
• 沒有dataType屬性（這是您的情況），jQuery將猜測數據類型，並且可能會猜測它是JSON。 在這種情況下， $.parseJSON將失敗，因為jQuery將已經解碼了JSON字符串並將結果顯示為data參數。
• 您可以使用.html(...)方法將某些元素的內容設置為某些文本。 html()僅應在內容確實為HTML時使用，否則（我認為是您的情況）應使用.text(...) ;
• a元素沒有value屬性，因此在其上調用.val()並沒有達到預期的效果。
• 您想將oilid值傳遞給ajax_cross函數，但要向其提供this ，它是HTML元素（ a ），而不是值。
• 迭代數組時，您將一遍又一遍地設置每次迭代中完全相同的元素的內容，這意味着只有最后一次迭代才能確定內容是什么。 您應該將每個文本放在適當的元素中，以避免覆蓋先前的寫入值。
• 您共享的HTML僅具有用於將第一個array元素的結果寫入的空間-第二行，第三行等應該有相似的元素。

為了解決所有這些問題，您可以從以下代碼中獲得啟發：

$.ajax({
    type: "GET",
    url: "my url" + x,
    dataType: "json", // corrected spelling and type
    success: function(data){
        // Don't parse as JSON string any more, data alread is object;
        // Don't name your variable jsonArray, it is neither of those
        var result = data.result;
        var jsonArray3 = result.oilFilter;
        $.each(jsonArray3, function (i1, js2) {
            var proname = js2.productName;
            var mrp = js2.mrp;
            var deliveryStatus = js2.deliveryStatus;
            var oilid = js2.productId;
            // bind onclick handler with oilid argument bound to it:
            // use `get()` to select the next element of the same class:
            $(".oilid").get(i1).off('click').on('click', ajax_cross.bind(null, oilid));
            // use text(), not html()
            $(".deliveryStatusOil").get(i1).text(deliveryStatus);
            $(".mrpoil").get(i1).text(mrp);
            $(".oilprodetail").get(i1).text(proname);
        });
    }
});

<label id="oilprodetail" class="oilprodetail"></label><br/>
<label id="mrpoil" class="mrpoil"></label><br/>
<!-- remove onclick attribute, we bind the handler dynamically -->
<a id="oilid" class="oilid" >View</a>

<hr><!-- repeat elements for second row -->
<label id="oilprodetail" class="oilprodetail"></label><br/>
<label id="mrpoil" class="mrpoil"></label><br/>
<!-- remove onclick attribute, we bind the handler dynamically -->
<a id="oilid" class="oilid" >View</a>

<hr><!-- repeat elements for third row -->
<label id="oilprodetail" class="oilprodetail"></label><br/>
<label id="mrpoil" class="mrpoil"></label><br/>
<!-- remove onclick attribute, we bind the handler dynamically -->
<a id="oilid" class="oilid" >View</a>

上面的方法還是不理想的，因為您最好在遍歷Ajax結果時動態地創建元素，因此您將擁有所需的數量。