помочь с обновлением содержимого JQuery в HTML

Question

я использую jquery ajax для получения данных из php файла.

data = <option>Peter</option><option>Maria</option>

я хочу затем использовать jquery, чтобы поместить эти данные после первого варианта

<select>
   <option>Name</option>
</select>

Я не могу использовать html () при выборе, потому что тогда будет удалена первая опция. Какую функцию JQuery я могу использовать, чтобы поместить их после первого?

РЕДАКТИРОВАТЬ: я не могу использовать добавление, потому что тогда, когда я делаю другой запрос, и данные:

data = <option>Michael</option><option>Erik</option>

Петр и Мария по-прежнему будут в списке выбора. Как я могу сделать? Я пытался иметь

<div id=addhere></div>

после первого параметра, а затем используйте html (), но он не работает. Weird. как я могу решить это?

Answer 1

РЕДАКТИРОВАТЬ: Изменение моего ответа, чтобы ответить на ваш вопрос после того, как вы обновили его ...

Допустим, вы возвращаете через AJAX следующее:

data = "<option>Michael</option><option>Erik</option>";

Затем вы можете просто обновить эти данные и использовать html ()

data = "<option>Name</option>" + data;
$("#selectToModify").html(data);

Вот старый ответ, просто для справки:

$("#divToAddTo").append(data);

html () заменит innerHTML элемента. append () добавит любые данные в конец innerHTML.

Answer 2

Сохраните исходные параметры в переменной и добавьте ответ AJAX вместе с исходными параметрами.

Рабочая демоверсия:

http://jsbin.com/otiro (редактируется через http://jsbin.com/otiro/edit)

Источник:

<select id="name">
  <option>Name</option>
</select>
<script type="text/javascript">
  var nameSelect = $('#name'), originalOptions = nameSelect.children();

  function handleAjaxResponse(response) {
    nameSelect.children().remove().end().append(originalOptions.add(response));
  }

  $.get("getNames.php", handleAjaxResponse);
</script>

Answer 3

Я не уверен, что полностью понимаю вопрос, но посмотрите на jQuery ссылку для функций, которые вы можете использовать для вставки контента. insertAfter может быть тот, кого вы ищете.

Answer 4

Я использовал функцию удаления jquery, чтобы удалить всех братьев и сестер в первую опцию, прежде чем я добавил новые опции ... это работало отлично ... =)

Answer 5

ознакомьтесь с функцией jQuery docs

Answer 6

Принятый ответ на на этот вопрос показывает, как добавлять опции к выборкам с помощью jQuery, а не заменять существующие.