代码之家  ›  专栏  ›  技术社区  ›  Phil

用输入值更新DIV的文本

  •  1
  • Phil  · 技术社区  · 15 年前

    我试图更新一个有几个输入按钮的DIV的文本。单击输入按钮时,按钮的值应传递给DIV并替换DIV中的文本。

    它基本上是一个下拉菜单,当用户单击某个选项时,它会关闭。由于明显的原因,我希望按钮的名称替换默认的“选择一个”。

    其结构如下:

                        <div class="button_slide" rel="slide1">Choose one</div>
                        <div class="content_slide slide1">
                            <input id="ButtonCake" class="button_vertical special_button" type="button" value="Cake" size="10px" />
                            <input id="ButtonNoCake" class="button_vertical special_button" type="button" value="No Cake" />                                                                            
                        </div>  
    

    因此,当用户单击“蛋糕”时,我希望“选择一个”更改为“蛋糕”。我有很多这样的字段,所以一个真正通用的jquery解决方案会非常棒。 谢谢你的阅读。

    5 回复  |  直到 15 年前
        1
  •  4
  •   Bozho    15 年前
    $(".button_vertical").click(function() {
       $(".button_slide").text($(this).val());
    });
    

    .button_slide <div> $(this).parent().children(".button_slide")

        2
  •  1
  •   Stephan Muller    15 年前
    $('button').click(function(){
      $('.button_slide').text($(this).val());
    })
    

        3
  •  0
  •   Aaron Hathaway    15 年前
    $('input').click(function() {
      var new_val = $(this).val();
      $('.button_slide').val(new_val);
    });
    
        4
  •  0
  •   Garis M Suero    15 年前

    click() button_slide text()

    $(".special_button").click(function(e) {
       $(".button_slide").text($(this).val());
    });
    

        5
  •  0
  •   WGF    15 年前
    <div class="button_slide" rel="slide1" id="sld">Choose one</div>
    <div class="content_slide slide1">
    <script language="javascript">
    
    var buttonArr = new Array("Cake","No Cake");
    for(var i=0;i<buttonArr.length;i++){
     document.write(" <input onclick='showvalue(this.value)' class='button_vertical special_button' type='button' value='"+buttonArr[i]+"' />")
    }
    function showvalue(value){
     document.getElementById("sld").innerHTML = value;
    }
    </script>
    </div>