Question

我正在尝试从表单中获取输入值并将其设置为对象属性。在表单内部有两个div，一个用于contact1详细信息，另一个用于contact2。

为了解决这个问题，我创建了一个javascript对象“ ContactTab（）”及其属性，然后我创建了两个实例“ contact1 ”和“ contact2 “以及方法” setName（）“来设置名称。

最后我编写了方法“populateContactTab（”divID“）”，其目的是根据函数中指定的div填充“contact1”或“contact2”。

我没有收到任何错误，但是当我输出一个实例对象时，名称为空。

我应该这样做吗？

谢谢。

HTML

<form id="jform" action="" method="get">
  <div id="primaryContact" style="float:left;">
        <label for="jname">First name:</label>
        <input type="text" id="jname" class="contactTab jname" name="fname" value=""><br>

   </div>
   <div id="secondaryContact" style="float:right;">
        <label for="jname">First name:</label>
        <input type="text" id="jname" class="contactTab jname" name="fname" value=""><br>            
    </div>
  <input type="submit" value="Submit">
</form>

JAVASCRIPT

function ContactTab() // I specify the object
{
    this.name = "";
    this.lastName = "";
    this.address = "";
    this.age = "";
    this.phone = "";
}
var contact1 = new ContactTab();//Create two instances
var contact2 = new ContactTab();    

function populateContactTab(divID){ //should get values of inputs of specific class and set them to one of the instances.

    event.preventDefault();

    var objectName; 
    if (divID == "primaryContact")
    { 
        objectName = "contact1";
    }
    else (divID == "secondaryContact") 
    {  
        objectName = "contact2";
    }


    $(".contactTab").each( function(index, item){
        switch(item) 
        {
        case $(this).hasClass('jname'):
            objectName.setName($(this).val()); 
        case 'jlastName':
            objectName.setLastName();     
        case 'jage':
            objectName.setAge();      
        case 'jphone':
            objectName.setPhone();
        case 'jaddress':
            objectName.setAddress();
            break;

        }
    });

}

ContactTab.prototype.setName = function(newName)
{
    if (typeof newName != 'undefined')
    {
        this.name = newName;
    }
    else
    {
        document.write("Please enter a valid name");
    }
};

Answer 1

有几个问题。

首先，您应该分配对象，而不是它们的名称：

if (divID == "primaryContact")
    { 
        objectName = contact1;
    }
else if (divID == "secondaryContact") 
    {  
        objectName = contact2;
    }

if之后你还错过了else。

其次，您需要将.each()循环限制为您处理的DIV：

$("#"+divID).find(".contactTab").each(...);

第三，你不能按照你的方式使用switch，它应该是一系列if s：

if ($(this).hasClass("jname")) {
    objectName.setName($(this).val());
} else if ($(this).hasClass("jlastName")) {
    objectName.setLastName($(this).val());
} else if ($(this).hasClass("jage")) {
    objectName.setAge($(this).val());
} ...

switch仅用于将值与一系列文字进行比较，但在您的情况下，item是一个jQuery元素，而不是类名。

最后，正如评论中所述，您需要使所有元素的id属性都是唯一的，因此您无法像以前那样重复使用id="jname"。

在某个div下获取给定类的元素并获取每个值

HTML

JAVASCRIPT

1 个答案: