从动态div中的值显示数组

时间:2013-11-12 19:44:09

标签: javascript

我想知道如何从div span获取值并创建一个数组(),稍后我可以使用该数组创建对数据库的查询。我试图以某种方式解决它,但我不能。

HTML

<form>
    <span class="input-component"><input type="text"/><a href=#></a></span>
 </form>
<br><br>
<div id="numcontainer">
    <span class="containernum"></span><br>
</div>

Java脚本

jQuery(function($) {

var values = [];

    $('#numcontainer').on('click', 'a.js-delete', function(e) {
      $(this).prev().remove(); // the <span>
      $(this).next().remove(); // the <br>
      $(this).remove(); // the <a> itself
    });

      $('form input[type=text]').change(fileChangeHandler);
      function fileChangeHandler() {
        var form = $(this).closest('form');        
      }
     var form = $(this).closest('form');

    $('form .input-component input').on("propertychange keyup input paste",addInput);
    onlyNums($('form .input-component input'));
   function addInput() {
    var remainingChars = $(this).val().length;
    if (remainingChars == 24) {
        if ($('.containernum').text() == '') {
            $('.containernum').text($(this).val());
        } else {
            $('#numcontainer').append('<span class="containernum">'+$(this).val()+'</span><a class="js-delete href=#>[X]</a><br>');
        }
        $(this).val(''); // does empty the text input
$('.containernum').each(function(index){
  // Your code
  console.log( $(this).html() );
});


        values.push($(this).val());
        console.log(values);
    }
}


    function onlyNums($elem){
        $elem.keydown(function(event) {
        // Allow only backspace and delete
        if ( event.keyCode == 46 || event.keyCode == 8 ) {
            // let it happen, don't do anything
        }
        else {
            // Ensure that it is a number and stop the keypress
            if (event.keyCode < 48 || event.keyCode > 57 ) {
                event.preventDefault(); 
            }   
        }
    });
    }

    });

Example jsFiddle

感谢您的时间

2 个答案:

答案 0 :(得分:1)

您想要存储值;为什么不使用隐藏的输入?不要使用相同的类创建跨度,而是创建具有相同名称的input元素。

<div id="numcontainer">
    <input type="hidden" name="myNums" value="305" />
    <input type="hidden" name="myNums" value="49" />
</div>

然后,当你想要得到这些值时,你只需要做这样的事情:

var values = [];
$("#numcontainer input:hidden[name='myNums']").each(function() {
    values.push( $(this).val() );
});

如果您的价值观无关,那么您只需将它们命名为不同的颜色即可。

答案 1 :(得分:0)

$('span.containernum').html()

OR

$('span.containernum').text()

会做到这一点。您将获得可以内爆或执行任何操作的html字符串。 有关这两个函数之间的区别,请参阅https://stackoverflow.com/a/1910830/2806497