2

我正在尝试从表单中获取输入值并将它们设置为对象属性。表单内部有两个 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");
    }
};
4

1 回答 1

1

有几个问题。

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

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

您还缺少ifafter else。

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

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

三、不能switch按你的方式使用，应该是一串ifs：

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"像以前那样重用。

于 2013-09-18T10:51:01.760 回答