javascript - 向 jquery ui 可排序列表中的每个项目添加删除按钮

Question

我正在尝试向 Rails 中的 jquery ui 可排序列表中的每个项目添加删除按钮。我可以添加项目，并且会出现按钮，但是当我单击它时，它会刷新页面并且所有 javascript 部分都变得不可用。

这就是我所做的；

CoffeeScript :

$ ->
  $( "#sortable" ).sortable({
    revert: true
  });
  $( "#draggable" ).draggable({
    connectToSortable: "#sortable",
    helper: "clone",
    revert: "invalid"
  });
  $( "ul, li" ).disableSelection();

  $('#additem').click (e) ->
    e.preventDefault()
    text = $("#e2").val()
    $li = $('<li class=\'alert alert-info\' style="font-weight: bold;"/>').text(
          text).append(
          $('<a />', 'id' : 'delete', 'class': 'glyphicon glyphicon-remove', 'href': '#', 'style' : 'float: right;'))
    $('#sortable').append $li
    $('#sortable').sortable 'refresh'
    return

  $('#sortable #delete').click ->
    $(this).parent().remove()
    return

HTML(Rails):

  <h3>Questions</h3>
  <%= select_tag 'user', options_for_select(@questions.collect{ |q| [q.content] }), id: "e2", name: "add1" %>

  <a href="#" id="additem" class="btn btn-primary">Add Question</a><br />
  <ul id="sortable">

  </ul>

Answer 1

使用由rails生成的html添加按钮

<a href="/question/question_id" data-remote="true"  data-method="delete" data-comfirm="Are you sure?" role = "button" class="btn btn-remove">delete
</a>

您忘记在链接生成期间放置 method:delete 和 remote:true