JS字符串将来自多个文本框的文本输入组合在一起

JS string together text input from multiple textboxes

本文关键字：文本 组合 在一起 输入 字符串 将来 JS      更新时间：2023-09-26

下面是一个js-fiddle示例：

http://jsfiddle.net/YD6PL/80/

HTML:

<input type="text">
<input type="text">
<input type="text">
<input type="text">
<div>
<button class="buttons">d</button>
<button class="buttons">o</button>
<button class="buttons">g</button>
<button class="buttons">s</button>
</div>
<button id="next">Next</button>

JS:

$(document).ready(function () {
    $('input').click(function(){
        $(this).addClass('active').siblings('.active').removeClass('active')
    });
    $(".buttons").click(function () {
        var cntrl = $(this).html();
        $('input.active').val(cntrl);
    });
      $( "#next" ).click( function() {
       alert("When user clicks next button I would like the input from all 4 textboxes strung together into a word and alerted---like 'dogs' in this example");  
      });
});

如何将每个文本框中的字符"串"在一起，以提醒单词"dogs"（例如本例中的单词）？

在#next中单击可以放入一个foeach按钮来捕获所有输入字段。

$( "#next" ).click( function() {
    var completeString = "";
    $('input').each(function(){
        completeString += $(this).val();
    });
    alert(completeString);  
});

试试这个：

Fiddle演示

HTML:

<input id="d" type="text">
<input id="o" type="text">
<input id="g" type="text">
<input id="s" type="text">
<div>
    <button class="buttons" value="d">d</button>
    <button class="buttons" value="o">o</button>
    <button class="buttons" value="g">g</button>
    <button class="buttons" value="s">s</button>
</div>
<button id="next">Next</button>

JavaScript:

$(document).ready(function () {
    $(".buttons").click(function () {
        var cntrl = $(this).val();
        $($('input').get($(this).index())).val(cntrl);
    });
    $("#next").click(function () {
        var toAlert = $('#d').val() + $('#o').val() + $('#g').val() + $('#s').val();
        alert(toAlert);
    });
});

您可以像下面这样使用每个jquery。

这是jsfiddle：http://jsfiddle.net/w9zn9gLw/1/

$( "#next" ).click( function() {
       var str = "";
      $( ".buttons" ).each(function(  ) {
         str += $(this).html();
        });
      alert(str);
  });

如果它回答了您的问题，请标记为答案

循环输入文本将解决此

$( "#next" ).click( function() {
      var text = '';
      $.each($('input[type="text"]'),function(v,k){
        text += $(k).val();
        });
      alert(text);
  });

http://jsfiddle.net/YD6PL/85/

相关文章：