Javascript 如何弹出选择列表，并使用选择更新站点？

我在DIV容器中有一些文本。当用户单击该文本时，我希望弹出一个选择列表。当用户从选择列表中选择一个值并单击“保存”按钮时，DIV容器应使用选择列表中的文本进行更新

我应该如何处理这个问题？我不知道如何使选择列表弹出。如果我让它在一个新的选项卡中弹出，我如何将它保存在以前的站点上

---

谢谢

如果您熟悉jQuery，您可以使用一个名为的插件，它功能强大，您可以使用它做出惊人的事情

下面是一些示例代码：

<div class="edit" id="div_1">Dolor</div>
<div class="edit_area" id="div_2">Lorem ipsum dolor sit amet, consectetuer 
adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore 
magna aliquam erat volutpat.</div>

上面的代码做了几件事：类为.edit的元素变得可编辑。编辑从单击鼠标开始。表单输入元素是文本。输入元素的宽度和高度与原始元素匹配。如果用户在外部单击，则表单更改将被放弃。如果用户点击

ESC

，也会发生同样的情况。当用户点击

ENTER

时，浏览器将文本提交到

www.example.com

上的

save.php

提交更改时，以下数据将

发布到服务器：
id=elements\u id&value=user\u edited\u content
查看jsFiddle.net上的演示

HTML

<div id="baseDiv">Click Me</div>
<div id="popUpDiv">
  <select id="popupSelect">
      <option value="First">First</option>
      <option value="Second">Second</option>
      <option value="Third">Third</option>
  </select>
</div>​

CSS

#popUpDiv{
   z-index: 100;
   position: absolute;
   background-color: rgba(123, 123,123, 0.8);
   display: none;
   top: 0;
   left: 0;
   width: 200px;
   height: 300px;
}
#popupSelect{
   z-index: 1000;
   position: absolute;
   top: 130px;
   left: 50px;
}​

希望这对你有用。
很好。它有“内联选择”。我将看一看：）jQuery有很多类似的插件，我个人使用这个，因为它功能强大、灵活、易于使用；）
 $("#baseDiv").click(function(e) {
    $("#popUpDiv").show();
 });
 $("#popupSelect").change(function(e) {
    $("#baseDiv").html($("#popupSelect").val() + ' clicked. Click again to change.');
    $("#popUpDiv").hide();
 });​

#popUpDiv{
   z-index: 100;
   position: absolute;
   background-color: rgba(123, 123,123, 0.8);
   display: none;
   top: 0;
   left: 0;
   width: 200px;
   height: 300px;
}
#popupSelect{
   z-index: 1000;
   position: absolute;
   top: 130px;
   left: 50px;
}​