如何使用Javascript根据单选按钮选择更改文本答案

【问题标题】：How to change text according to radio button selection using Javascript如何使用Javascript根据单选按钮选择更改文本
【发布时间】：2014-12-04 06:34:12
【问题描述】：

I've a dropdown list which contains a set of names.. When select one name, a set of data will be generated from database..

这些数据将绑定到 Radiobutton 列表控件中，该控件位于该控件下..

我有一个预定义文本为“hello”的文本控件..

现在，“你好”必须用我在单选按钮列表中选择的文本进行更改..

例如，我在单选按钮列表中有“Apple，Orange，Grape”。当我第一次选择 Apple 时，“Hello”更改为“Apple”。我这样做了。但是当我选择“Orange”时", "Assple" 没有改变.. 怎么做..？

function SelectChanged(Radiolst)
{
    var mailBdy = document.getElementById("<%=txtEditor.ClientID  %>");
    var toMember = document.getElementById(Radiolst);
    var selectedTxt=$(toMember).find(":checked").next().html();
    var newBod = $(mailBdy).val();
    newBod=newBod.replace('Hello',selectedTxt);
    mailBdy.value = newBod;
    alert(mailBdy.value);
}

函数SelectChanged是单选按钮列表的客户端函数。第一次alert显示“Apple”，但下次它不会改变..

这里是txtEditor和Radiobutton列表控件的ASP.NET编码..

<asp:RadioButtonList ID="lstTo" runat="server"   ></asp:RadioButtonList>

<textarea id="txtEditor" name="txtEditor" style="width: 100% ; height :300px " runat="server" enableviewstate ="true"  > </textarea>

【问题讨论】：

因为在第一次更改中，您的代码会搜索“Hello”并对其进行更改。在第二次更改中，您的代码仍然搜索“Hello”并且找不到它。您必须发布您的 HTML 代码。
发布您的 html 以供澄清
什么的HTML代码，单选按钮列表或txteditor？
任何与当前问题有关的内容。
在您的字符串 newbod 中，您正在搜索 hello 并将其替换为您的选择。你应该做一个作业：$(mailbdy).val(selectedtext)。我也不推荐这种香草 JavaScript 和 jquery 的意大利面。

标签： javascript jquery

【解决方案1】：

由于没有提供标记，我在这里猜测一下：

对于 HTML 类似：

<select>
<option value="orange">
<option value="apple">
</select>
<input type="radio" id="Radiolst" value="Hello" name="some">

jQuery 应该是这样的：

$(document).ready(function () {
  $('select').on('change', function (e) {
    var optionSelected = $("option:selected", this);
    var valueSelected = this.value;
    $("#Radiolst").val(valueSelected);
    $("#txtEditor").text(valueSelected);
  });
});

记得把它放在文档的<head> 标签中。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

DEMO FIDDLE

【讨论】：

好的.. 谢谢.. 如果我有两个文本“Hello Fruit”，我想单独使用单选列表选择方式更改“Fruit”，该怎么做？
是的，它是.. 但对我来说，txtEditor 没有替换.. 但在警报中，它会改变..
可能您有多个具有相同 id 的
我只有一个..正如你所说，它如何将 Fruit 更改为 Apple 并正确显示警报..？
我没有告诉txtEditor 更改.. 我正确地告诉并显示alert.. 再看看.. 我需要帮助.. 所以如果我发布相互矛盾的陈述，你伙计们不能正确地帮助我..

【解决方案2】：

试试这个：

var globalVar = 'hello';
function SelectChanged(Radiolst)
{
    var mailBdy = document.getElementById("<%=txtEditor.ClientID  %>");
    var toMember = document.getElementById(Radiolst);
    var selectedTxt=$(toMember).find(":checked").next().html();
    var newBod = $(mailBdy).val();
    newBod=newBod.replace(globalVar,selectedTxt);
    globalVar = selectedTxt;
    mailBdy.value = newBod;
    alert(mailBdy.value);
}

【讨论】：