Question

如何使用Jquery选择一个单词并将其保存到数据库中。即假设我的页面中有以下内容，

"<p>This is a beautiful sentence </p>"

如果单击“美丽”，我想显示一个弹出选项“添加”。如果单击“添加”，单词“美丽”将保存在我现有的单词数据库中。如果我再次单击它，它将不被保存，则该数据库包含唯一的单词。

我在Django中工作。

编辑：我尝试了以下方法：

<script>
$(document).ready(function(){
  $("p").click(function(){
    var value = $(this).text();
    var input = $('#my_input');
    input.val(value);
  });            
});    
</script>

Answer 1

示例：

$(function() {
  $("p.allow-click span").click(function() {
    var value = $(this).text();
    var input = $('#my-input');
    input.val(value);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p class="allow-click"><span>This</span> is a <span>beautiful</span> <span>sentence</span>.</p>
<input id="my-input" type="text" />

如您所见，这允许每个特定单词都具有点击事件。您几乎可以使用任何标签，但是<span>从某种意义上讲是侵入性最小的标签。您可以使用<b>，<i>或其他HTML标记。这些可能会更改<span>不会改变文字的字体或外观。

更新

如果您不想手动编辑HTML，而是在jQuery中完成所有操作，则可能会遇到以下情况：

$(function() {
  function applyClick($t) {
    var inner = $t.text().trim();
    var trail = false;
    if (inner.slice(-1) == ".") {
      trail = true;
      inner = inner.slice(0, -1);
    }
    var parts = inner.split(" ");
    $.each(parts, function(k, v) {
      parts[k] = "<span>" + v + "</span>";
    });
    var myInner = parts.join(" ");
    if (trail) {
      myInner = myInner + ".";
    }
    $t.html(myInner);
    $t.find("span").click(function() {
      var value = $(this).text();
      var input = $('#my-input');
      input.val(value);
    });
  }
  applyClick($(".allow-click"));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p class="allow-click">This is a beautiful sentence.</p>
<input id="my-input" type="text" />

希望有帮助。

jQuery-从文本中选择单个单词

1 个答案: