Question

$(".td").click(function() {
    switch (elementNode.previousSibling.id)
    {
  case "location"
    (".td").replaceWith('<input type="text" name="location"></input>');
    break;
  case "occ"
    (".td").replaceWith('<input type="text" name="occ"></input>');
    break;
  case "hobby"
    (".td").replaceWith('<input type="text" name="hobby"></input>');
    break;
    }
});

以上是我正在使用的Javascript，这是HTML

<div class="tr"><div class="td" id="location">{L_LOCATION}:</div> <div class="td">{LOCATION}</div></div>
<div class="tr"><div class="td" id="occ">{L_OCCUPATION}:</div> <div class="td">{OCCUPATION}</div></div>
<div class="tr"><div class="td" id="hobby">{L_INTERESTS}:</div> <div class="td">{INTERESTS}</div></div>

我想要做的是当有人点击＆＃34; .td＆＃34; div将其转换为输入字段。我认为我需要使用switch的原因是需要满足很多条件（正如你在代码中看到的那样）并且if和else语句太多了。所以我不确定我是否正确这样做，因为我刚刚开始编程（在这里完成初学者，如果有大量错误，请原谅我）你在HTML中看到的内容标签是模板变量，以防您想知道。

Answer 1

我已经测试了这段代码，但它确实有效：

$(function() {   
$(".td").on('click', function() {
  var id = $(this).prev().attr("id");
  console.log(id);
        switch (id)
        {
          case "location":
        $(this).replaceWith('<input type="text" name="location"></input>');
        break;
          case "occ":
         $(this).replaceWith('<input type="text" name="occ"></input>');
        break;
          case "hobby":
         $(this).replaceWith('<input type="text" name="hobby"></input>');
        break;
        }        
 });
        });

http://jsbin.com/ogofus/1/edit

（只点击白色文字）

使用.replaceWith和开关功能

1 个答案: