如何使用javascript更改按钮图标并在MJQ中打开新的文本区域

大家好，我有一个像这样的移动JQuery表单

<header>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta content="width=device-width, initial-scale=1, maximum-scale=1" name="viewport">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
<link href="http://wstation.inmomundo.com/static01/cssii/costarica/themes/inmomobile.css" type="text/css" rel="stylesheet">
<link href="http://wstation.inmomundo.com/static01/cssii/costarica/themes/jquery.mobile.icons.min.css" type="text/css" rel="stylesheet">
<link href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" rel="stylesheet">
</header>

<fieldset data-role="controlgroup" data-mini="true" style= "color:#006699 !important">

<h4>Estoy interesado(a) En la propiedad, </h4>
<input  onclick="opendiv1()" class="" id="radio-choice-1" name="opcmessage" title="" type="radio" value="1" />
<label for="radio-choice-1">favor de enviarme más información</label>

<input  onclick="opendiv2()" class="" id="radio-choice-2" name="opcmessage" title="" type="radio" value="2" />   
<label for="radio-choice-2"> deseo visitarla</label>

<input  onclick="opendiv3()" class="" id="radio-choice-3" name="opcmessage" title="" type="radio" value="3"  />
<label for="radio-choice-3"> envieme fotos</label>

<input  onclick="opendiv4()" class="" id="radio-choice-4" name="opcmessage" title="" type="radio" value="4" />
<label for="radio-choice-4">envieme más fotos</label>

</fieldset >


<textarea cols="40" rows="8" name="textarea" id="textarea"></textarea>

<a data-rel="back" href="#pageone" data-icon="delete" data-inline="true" data-role="button"  data-theme="c" title="Close">Cancelar</a>


<div style="float: right; margin-right: -10px;">
<input  class="me" data-theme="c" data-role="button" data-inline="true" type="submit" data-icon="search" id="im_send_message" name="im_send_message" value="Enviar"  />
</div>

 </form>
</div>



</div>

我也有一些，请看一看

回答

在@Omar给出的答案的帮助下，我完成了这件事 这是一把小提琴

---

jQuery Mobile将所有类型的输入包装在一个div中。该div保存所有样式，因此，如果要对输入进行任何更改，需要将其应用于该div

要收听单选按钮上的更改，您需要使用

change

event

$(document).on("pagecreate", function () {
    $("#textarea").hide();
    $("[name=opcmessage]").on("change", function () {
        var text = $(this).closest("div").find("label").text();
        $("#textarea").text(text).show();
        $(".me").closest("div").removeClass("ui-icon-search").addClass("ui-icon-check");
    });
});

---

是的，但是ENviar按钮中的图标没有改变。我想知道是否有可能在函数上写下可以完成工作的内容，而不是写那么多函数。是的，Omar，我试着学习如何收听单选按钮有一段时间了。这是完美的，但当我把它放在我真正的网站上时，这段代码不起作用。你能解释一下。on（'pagecreate'，function（））是如何工作的吗？@Vikram你好，你需要添加pageID，我忘了提到它了<代码>“页面创建”，“页面ID”，函数哦！好的，thanx，让我看看是否有效。但我想告诉你。我一直在尝试实现tap、change、vclick等事件，即使是touchstart，到目前为止这些都不起作用IDk可能是javascripterror@VikramAnandBhushan是，与jq和JQM相关。因为除非您使用旧版本或在jq之前加载JQM，否则代码应该可以工作。

$(document).on("pagecreate", function () {
    $("#textarea").hide();
    $("[name=opcmessage]").on("change", function () {
        var text = $(this).closest("div").find("label").text();
        $("#textarea").text(text).show();
        $(".me").closest("div").removeClass("ui-icon-search").addClass("ui-icon-check");
    });
});