2014-04-12 28 views
0

我在html中收集这个表单以收集macaddress,并且我想输出(CompleteMacAddress)文本值中的所有输入数据,如(10-20-30-40-50-60 )在一个隐藏文本输入中收集多个输入

任何帮助的JavaScript或jQuery的?

<form name="form1" action="" method="get"> 
    <input name="MacAddressPart1" type="text" id="MacAddressPart1" size="2" maxlength="2" > 
    <input name="MacAddressPart2" type="text" id="MacAddressPart2" size="2" maxlength="2"> 
    <input name="MacAddressPart3" type="text" id="MacAddressPart3" size="2" maxlength="2"> 
    <input name="MacAddressPart4" type="text" id="MacAddressPart4" size="2" maxlength="2"> 
    <input name="MacAddressPart5" type="text" id="MacAddressPart5" size="2" maxlength="2"> 
    <input name="MacAddressPart6" type="text" id="MacAddressPart6" size="2" maxlength="2"> 

    <input type="hidden" name="CompleteMacAddress" value=""> 

+1

'Java'!='JavaScript'。如果您不确定要选择哪一个,请阅读您正在使用的标签的说明。 – Pshemo

回答

4

这应该工作正常:

$(function() { 
    var macSelector = "input[name^='MacAddressPart']"; 
    $(macSelector).bind('keyup', function() { 
     var macs = $.map($(macSelector), function(input) { return $(input).val(); }) 
     $('input[name="CompleteMacAddress"]').val(macs.join("-")) 
    }); 
}); 

看到它的效果,enter link description here。请注意,随着用户输入,它会更新;)

+1

它不会和其他输入元素一起玩。它更好地使用选择器中的真正的ID /类。 –

+1

我知道。因为他不是第一次使用课程(在他原来的例子中),那是我的第一个解决方案。作者可以调整它以使用更合适的选择器,当然。我强烈建议他改变我的例子,使之更加精确。 – leandroico

+0

这是什么原因downvote这个解决方案,顺便说一句?还是仅仅是一个简单的破坏,为了让你的光芒更加明亮? – leandroico

1

给你所有的HTML元素正确编号(包括形式和隐藏输入)。

$("#formID").submit(function(event) { 
    $("#hiddenID").value(
    $("#MacAddressPart1").val('00')+"-"+ 
    $("#MacAddressPart2").val('00')+"-"+ 
    $("#MacAddressPart3").val('00')+"-"+ 
    $("#MacAddressPart4").val('00')+"-"+ 
    $("#MacAddressPart5").val('00')+"-"+ 
    $("#MacAddressPart6").val('00') 
); 
}); 

'00'将导致其默认为00-00-00-00-00-00柜面有没有价值。

+0

这不是最佳方式。 –

+0

因为?它比其他提议的解决方案更可读。 –

+0

它是可读的,但如果更改了一个名称,代码将不起作用。 –

0

只要使用一个文本字段输入整个mac并在更改时验证长度和字符会更容易。无论如何,你可以用基本的javascript - > document.getElementById('MacAddressPart6')。value和其他字符串值得到一个单独的输入值,然后使用getElementById('aaa')=

0

这是您要查找的内容吗?

$('[name="form1"]').submit(function() { 
    $('[name="CompleteMacAddress"]').val(
     $('[name="MacAddressPart1"]').val() + '-' + 
     $('[name="MacAddressPart2"]').val() + '-' + 
     $('[name="MacAddressPart3"]').val() + '-' + 
     $('[name="MacAddressPart4"]').val() + '-' + 
     $('[name="MacAddressPart5"]').val() + '-' + 
     $('[name="MacAddressPart6"]').val() 
    ); 
}); 

编辑:

$('[name="form1"]').submit(function() { 
    $('[name="CompleteMacAddress"]').val($('input[id^="MacAddressPart"]').map(
     function() { return this.value || '00'; }).get().join('-')); 
}); 
+0

这不是最佳方式。 –

+0

而你最好的意思是......? – ThatWeirdo

+0

如果任何名字偶然发生变化,代码就不能工作。相反,你可以做得更干净,就像@Leandro回答。 –

0

的jsfiddle实施例:

http://jsfiddle.net/pdLh8/3/

检测KEYUP +更新输入:

 $(document).ready(function() { 
    $('input[id^="MacAddressPart"]').keyup(
    function() { 
     var mac = []; 
     $('input[id^="MacAddressPart"]').each(function (index) { 
      mac.push($(this).val()); 
     }); 
     $("input[name='CompleteMacAddress']").val(mac.join('-')); 
    }); 
}); 
相关问题