动态分配属性名称给对象

Question

基本上在下面的代码中有一个for循环，它包含10个元素，当我单击按钮时，它会console.log记录以下内容：

当前console.log：

Object {objectProperty: "0"} Object {objectProperty: "1"} Object {objectProperty: "2"} Object {objectProperty: "3"} Object {objectProperty: "4"} Object {objectProperty: "5"} Object {objectProperty: "6"} Object {objectProperty: "7"} Object {objectProperty: "8"} Object {objectProperty: "9"}

但是我希望对象属性名称是<span>的值，因此当我遍历元素时，它将分配一个新的属性名称，该名称将与<span>值相同。

因此，如果console.log运行正常，则应如下所示：

Object {0: "0"} Object {1: "1"} Object {2: "2"} Object {3: "3"} Object {4: "4"} Object {5: "5"} Object {6: "6"} Object {7: "7"} Object {8: "8"} Object {9: "9"}

到目前为止，我有：

  $(document).on('change', "select[id*='checkBox']", function(e) { // Disable or Enable input fields if (($("option:selected", this).text() === "No")) { $(this).next().next().attr('readonly', true).addClass('input-disabled'); } else { $(this).next().next().attr('readonly', false).removeClass('input-disabled'); } }); $(document).on('click', "#generateButton", function(e) { // Define associative arrays that will compose licence object var Signed = new Object(); var NotSigned = new Object(); var Licence = new Object(); // On generate button click, get all values to dynamically create signed and unsigned values $('.list-group-item').each(function(key, value) { var objectProperty = $(this)[0].children[1].innerHTML; Signed.objectProperty = $(this)[0].children[2].value; console.log(Signed); }); }); // Append list-groups on page so that configuration elements can be appended $("#optionalFieldsRow").children().find('.panel-body').append("<div class='row'><div class='col-sm-6 left'><ul class='list-group'></ul></div><div class='col-sm-6 right'><ul class='list-group'></ul></div></div>"); // Loop through configuration items and display element on page for (var i = 0; i < 10; i++) { $("#optionalFieldsRow").children().find('.left').find('.list-group').append("<li class='list-group-item'><select id='checkBox" + i + "' class='optionalFieldsRowCheckBox' name='checkBox" + i + "'><option>Yes</option><option>No</option></select><span class='optionalLabel'>" + i + "</span><input id='input" + i + "' type='text' value='" + i + "' name='input" + i + "'></li>"); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div id="page-wrapper"> <div class="row"> <div class="col-lg-12"> <ul class="list-group"> <!-- /.panel-body --> <div class="pull-right"> <button name="Save configuration button" id="generateButton" class="btn btn-primary">Generate .properties</button> <!--<button name="Save configuration button" onclick="GenerateLicence(this);" id="generateButton" class="btn btn-primary">Generate .properties</button>--> </div> </ul> </div> <!-- /.col-lg-12 --> </div> <div id="optionalFieldsRow" class="row"> <div class="col-lg-12"> <div class="panel panel-default"> <!-- /.panel-heading --> <div class="panel-body"> <!-- Optional fields for licences --> <div class="row"> <!-- /.row --> </div> </div> <!-- /.panel --> </div> <!-- /.col-lg-8 --> </div> <!-- /.row --> </div> <!-- /#page-wrapper --> </div> 

Answer 1

var obj = {};
obj["<new property name>"] = <new property value>;