保存和檢索選項，並從Json的

下一個是文字，按鈕，選擇元素的html：保存和檢索選項，並從Json的

<input type="button" id="addNextProjectID" value=" Add next project"/> 
<input id="setNewProjectID" type="text" value=" project name "/> 
<br> 
<select id="selectProjectID" onfocus="onFocusSelectProject()"> 
    <option value="Cats">Cats</option> 
    <option value="Dogs">Dogs</option> 
</select> 
</br>

守則，並添加選項可供選擇按鈕文本元素元素點擊

function addNextProjectF(){ 
var x = document.getElementById("selectProjectID"); 
var option = document.createElement("option"); 
option.text = document.getElementById("setNewProjectID").value; 
option.id = document.getElementById("setNewProjectID").value; 
x.appendChild(option); 
}

如何從select中將所有選項字符串化並將它們粘貼到Json變量，然後如何將它們解析回select元素。

我的選擇元素具有從html設置的前2個選項。我需要保持他們。在這裏，我想這樣做的方式是循環選擇元素選項，並將每個選項「追加」到Json，然後反轉，然後重新填充選擇元素。但是我還沒有遇到任何代碼的情況。你可以請求幫助我使用這個代碼嗎？

這種情況也是我不確定如何使用ajax的成功函數來填充select的選項。無論如何，也許我正在考慮完全錯誤的方法來得到我需要的結果。所以如何繼續？

隨着下一個（下面的代碼）嘗試我得到

{ 「0」：{}，「1」：{}，「2」：{}}

空字段中D B。我認爲「JSON.stringify（saveToprojectsList）」是錯誤的。

function saveToProjectsListF(){ 
    whichProjectToSave=document.getElementById("selectProjectID").value; 
    saveToprojectsList=document.getElementById("selectProjectID"); 
    var jsonProjectsListToPHP= JSON.stringify(saveToprojectsList); 

    console.log(jsonProjectsListToPHP); 
    $.ajax({ 
    method:"POST", 
    url: '/wp-content/themes/mypage/PsaveJson.php', 
    data: { 
    "sendProjectsList":1, 
    "whichProjectToSave":whichProjectToSave, 
    "jsonProjectsListToPHP":jsonProjectsListToPHP 
    }, 
    success: function(data){ 
    } 
    }); 
}

來源

2017-08-14 ivan golubar

有很多Q＆A關於Ajax，JSON和操作DOM。這當然是要走的路，但你應該先去看看它，如果你還有問題，請包括你嘗試的代碼和錯誤的地方。 StackOverflow不是用於編寫代碼的服務。 – trincot

我添加了填充字段在我的數據庫中的代碼，但數據是錯誤的。首先我需要在數據庫中看到正確的數據。然後我將進入下一步 - 從數據庫中獲取數據並重新填充select元素。 –

那麼你不想將'saveToprojectsList'串起來，因爲那是一個DOM節點。我會回答你的問題，但是這裏包含的問題太多了......（發送到服務器，從服務器讀取，更新'select'列表，並且對於大多數這些操作你沒有代碼）。我建議你一次只關注一個問題。 – trincot

的問題是相當廣泛的，所以我只會專注於，你必須試着用代碼來解決這個問題，即字符串化在選擇列表中的選項部分。

該代碼無法按預期工作，因爲saveToprojectsList是一個DOM對象，當您嘗試將其字符串化爲JSON時，它只會產生一個空對象。您可以使用map來提取option標記的文本內容。

注意：當你使用jQuery爲$.ajax，你可以在其他地方使用它，以及：

function onFocusSelectProject() {} 
 

 
$('#addNextProjectID').click(function addNextProjectF(){ 
 
    var value = $("#setNewProjectID").val(); 
 
    $("#selectProjectID").append($("<option>").text(value).attr("id", value)); 
 
}); 
 

 
$('#save').click(function saveToProjectsListF(){ 
 
    var whichProjectToSave = $("#selectProjectID").val(); 
 
    var saveToprojectsList = $.map($("#selectProjectID>option"), function (op) { 
 
     return $(op).text(); 
 
    }); 
 
    var jsonProjectsListToPHP = JSON.stringify(saveToprojectsList); 
 
    console.log(jsonProjectsListToPHP); 
 
    $.ajax({ 
 
     method:"POST", 
 
     url: '/wp-content/themes/mypage/PsaveJson.php', 
 
     data: { 
 
      sendProjectsList: 1, 
 
      whichProjectToSave: whichProjectToSave, 
 
      jsonProjectsListToPHP: jsonProjectsListToPHP 
 
     }, 
 
     success: function(data){ 
 
     } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="button" id="addNextProjectID" value=" Add next project"/> 
 
<input id="setNewProjectID" type="text" value=" project name "/> 
 
<br> 
 
<select id="selectProjectID" onfocus="onFocusSelectProject()"> 
 
    <option value="Cats">Cats</option> 
 
    <option value="Dogs">Dogs</option> 
 
</select> 
 
<input type="button" id="save" value="Save"/> 
 
</br>

來源

2017-08-14 20:11:44 trincot

保存和檢索選項，並從Json的

回答

相關問題