• 智能AI问答!更聪明、更完整、原创作!
  • 一款基于GPT的超级AI机器人,可以回答问题、聊天、创作、写文案!

HTML页面有两个多行文本框,第一个多行文本里是 JOSIN 前的数据,第二个是 JOSIN后的数据,有一个按钮,点击之后可以把文本转换到 josin 厚的数据文本框里,还有一个清空按钮

发布于 2024-02-20 15:58:58

要实现将JOSIN前的数据转移到JOSIN后的文本框中,并添加清空按钮的功能,您可以使用JavaScript来处理点击事件。以下是示例代码:

<textarea class="form-control" id="josinBefore" rows="8" placeholder="JOSIN前的数据"></textarea>
<textarea class="form-control" id="josinAfter" rows="8" placeholder="JOSIN后的数据"></textarea>

<button class="btn btn-primary" id="convertBtn">转换</button>
<button class="btn btn-danger" id="clearBtn">清空</button>

<script>
  var josinBeforeTextarea = document.getElementById("josinBefore");
  var josinAfterTextarea = document.getElementById("josinAfter");
  var convertBtn = document.getElementById("convertBtn");
  var clearBtn = document.getElementById("clearBtn");

  // 转换按钮点击事件处理
  convertBtn.addEventListener("click", function() {
    var josinBeforeData = josinBeforeTextarea.value;
    josinAfterTextarea.value = "JOSIN " + josinBeforeData;
  });

  // 清空按钮点击事件处理
  clearBtn.addEventListener("click", function() {
    josinBeforeTextarea.value = "";
    josinAfterTextarea.value = "";
  });
</script>

在上述代码中,我们首先定义了两个多行文本框josinBeforeTextareajosinAfterTextarea,以及一个转换按钮convertBtn和一个清空按钮clearBtn

然后,我们为转换按钮和清空按钮分别添加了点击事件监听器。当转换按钮被点击时,我们将JOSIN前的数据取出,并将其添加到JOSIN后的文本框中,以"JOSIN "前缀。当清空按钮被点击时,我们将两个文本框的内容清空。

通过以上代码,您可以实现将JOSIN前的数据转移到JOSIN后的文本框中,并添加了清空按钮的功能。

希望对您有所帮助!

0 条评论

发布
问题

在线
客服