我将角度函数存储为变量,如下所示:
job.addAddress = function() {
// Setup the object to pass to API
var addressObj = {};
$(".form__input__address").each(function () {
var name = this.name;
var value = this.value;
addressObj[name] = value;
});
console.log(addressObj);
}
调用该函数的HTML / Angular是:
<button id="addAddressBtn" ng-click="job.addAddress()" class="btn btn-default">Add Address to Book</button>
按钮在范围内,如html中所示:
<!-- Add Job Main -->
<main class="main" ng-controller="JobController as job">
<div class="wrap">
<h4>New Job</h4>
<a ng-click="job.back()" class="backlink"><i class="fa fa-arrow-circle-o-left"></i> Go Back</a>
<img id="ajaxLoader" src="../Content/images/ajaxLoad.gif" height="64" />
<pre id="ajaxResult"> </pre>
<form id="form" class="form js-form" data-formtype="Add Job"></form>
<button id="addJob" ng-click="job.addJob()" class="btn btn-default">Add Job</button>
</div>
<div id="AddressBook" class="modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title">Address Book</h4>
</div>
<div class="modal-body">
<div id="AddressHeading">
<h4>Please select an address from the address book...</h4>
</div>
<div id="addAddressReveal">
<button id="addAddressToggle" ng-click="job.addAddressReveal($event)" class="btn btn-default"><i class="fa fa-plus"></i></button>
</div>
<table id="addresses"></table>
<h4 id="addAddressTitle">Add an Address</h4>
<div id="addAddress" class="form__section__group">
<label class="form__label ">
Company
<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Enter the company name</span>
</span>
<input name="CompanyName" class="form__input__address js-required" type="text">
</label>
<label class="form__label ">
Building Name / No.
<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Enter the building name or number</span>
</span>
<input name="BuildingNameOrNo" class="form__input__address js-required" type="text" placeholder="e.g. '123' or 'Solutions House'">
</label>
<label class="form__label ">
Street Name
<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Enter the name of the street</span>
</span>
<input name="StreetName" class="form__input__address js-required" type="text" >
</label>
<label class="form__label ">
Locality
<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Enter the name of the local area</span>
</span>
<input name="Locality" class="form__input__address js-required" type="text" placeholder="e.g. 'Croydon'">
</label>
<label class="form__label ">
City
<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Enter the name of the city</span>
</span>
<input name="City" class="form__input__address js-required" type="text" placeholder="e.g. 'London'">
</label>
<label class="form__label ">
County
<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Enter the county</span>
</span>
<input name="Postcode" class="form__input__address js-required" type="text" placeholder="e.g. 'Staffordshire'">
</label>
<label class="form__label ">
Post code
<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Enter the postal code</span>
</span>
<input name="Postcode" class="form__input__address js-required" type="text" placeholder="e.g. 'ST5 9QF'">
</label>
<label class="form__label ">
Contact Name
<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Enter the name of a contact at this address</span>
</span>
<input name="ContactName" class="form__input__address js-required" type="text">
</label>
<label class="form__label ">
Contact Phone Number
<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Enter the phone number of a contact at this address</span>
</span>
<input name="ContactNumber" class="form__input__address js-required" type="text">
</label>
<label class="form__label ">
Tail Lift?
<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Is a taillift required for this address?</span>
</span>
<div class="form__label--radio">
<input name="Tailift" id="TailiftYes" type="radio" value="Yes">
<label for="TailiftYes">
<i class="fa fa-check-circle active"></i><i class="fa fa-circle-thin inactive"></i>Yes
</label>
<input name="Tailift" id="TailiftNo" type="radio" checked="checked" value="No">
<label for="TailiftNo">
<i class="fa fa-check-circle active"></i><i class="fa fa-circle-thin inactive"></i>No
</label>
</div>
</label>
<label class="form__label ">
Rigid Vehicle?
<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Is a rigid vehicle required for this delivery?</span>
</span>
<div class="form__label--radio">
<input name="Rigid" id="RigidYes" type="radio" value="Yes">
<label for="RigidYes">
<i class="fa fa-check-circle active"></i><i class="fa fa-circle-thin inactive"></i>Yes
</label>
<input name="Rigid" id="RigidNo" type="radio" checked="checked" value="No">
<label for="RigidNo"><i class="fa fa-check-circle active"></i><i class="fa fa-circle-thin inactive"></i>No</label>
</div>
</label>
<label class="form__label js-booking">
Booking Required?<span class="tooltip">
<i class="fa fa-question-circle"></i>
<span class="tooltip__content">Is a booking required for this delivery?</span>
</span>
<div class="form__label--radio">
<input name="RingForBooking" id="RingForBookYes" type="radio" value="Yes">
<label for="RingForBookYes">
<i class="fa fa-check-circle active"></i><i class="fa fa-circle-thin inactive"></i>Yes
</label>
<input name="RingForBooking" id="RingForBookNo" type="radio" checked="checked" value="No">
<label for="RingForBookNo">
<i class="fa fa-check-circle active"></i><i class="fa fa-circle-thin inactive"></i>No
</label>
</div>
</label>
<label class="form__label form__label--fullwidth">
Notes
<span class="tooltip">
<i class="fa fa-question-circle"></i><span class="tooltip__content">Is there anything else you need to know?</span>
</span>
<textarea name="Notes" class="form__input form__input--textarea" placeholder="Anything else we need to know?" type="text"></textarea>
</label>
<button id="addAddressBtn" ng-click="job.addAddress()" class="btn btn-default">Add Address to Book</button>
</div>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
我有一个非常相似的功能(只有更改是对象变量的不同名称),这没有问题,但是当页面加载时我得到错误:
SCRIPT16386:不支持此类接口
错误指向第123行:
group.appendChild(job.addAddress(line["Name"].toString(), line["HelpText"].toString(), line["FieldName"].toString(), line["TextType"].toString(), line["Placeholder"].toString(), "NO", line["ExtraClass"].toString()));
此行的其余功能是:
// Load all elements to the page from Job Def API
job.addElements = function (data) {
var form = document.getElementById("form");
var sName = "";
var gName = "";
var section;
var group;
jQuery.each(data.Data, function (no, line) {
if (line["Section"].toString() != sName) {
if (typeof section === "object") {
section.appendChild(group);
form.appendChild(section);
}
section = job.addSection(line["Section"].toString());
var h = document.createElement("H2");
var t = document.createTextNode(line["SectionName"].toString());
h.appendChild(t);
section.appendChild(h);
sName = line["Section"].toString();
group = job.addSectionGroup(sName + line["SectionGroup"].toString());
gName = line["SectionGroup"].toString();
}
if (line["SectionGroup"].toString() != gName) {
if (typeof group === "object") {
section.appendChild(group);
group = job.addSectionGroup(sName + line["SectionGroup"].toString());
gName = line["SectionGroup"].toString();
}
}
switch (line["Type"].toString()) {
case "TXT":
group.appendChild(job.addTextBox(line["Name"].toString(), line["HelpText"].toString(), line["FieldName"].toString(), line["TextType"].toString(), line["Placeholder"].toString(), "NO", line["ExtraClass"].toString()));
break;
case "TDW":
group.appendChild(job.addTextBox(line["Name"].toString(), line["HelpText"].toString(), line["FieldName"].toString(), line["TextType"].toString(), line["Placeholder"].toString(), "DW", line["ExtraClass"].toString()));
break;
case "TFW":
group.appendChild(job.addTextBox(line["Name"].toString(), line["HelpText"].toString(), line["FieldName"].toString(), line["TextType"].toString(), line["Placeholder"].toString(), "FW", line["ExtraClass"].toString()));
break;
case "LST":
group.appendChild(job.addSelect(line["Name"].toString(), line["HelpText"].toString(), line["FieldName"].toString(), line["Items"].toString().split("^"), line["Selected"], "NO", line["ExtraClass"].toString()));
break;
case "DPK":
group.appendChild(job.addDatePicker(line["Name"].toString(), line["HelpText"].toString(), line["FieldName"].toString(), line["TextType"].toString(), line["Placeholder"].toString()));
break;
case "TAR":
group.appendChild(job.addTextArea(line["Name"].toString(), line["HelpText"].toString(), line["FieldName"].toString(), line["TextType"].toString(), line["Placeholder"].toString()));
break;
case "ADR":
group.appendChild(job.addAddress(line["Name"].toString(), line["HelpText"].toString(), line["FieldName"].toString(), line["TextType"].toString(), line["Placeholder"].toString(), "NO", line["ExtraClass"].toString()));
break;
case "NST":
group.appendChild(job.addNumberStepper(line["Name"].toString(), line["HelpText"].toString(), line["FieldName"].toString(), line["TextType"].toString(), "0"));
break; //face
case "RAD":
group.appendChild(job.addOptions(line["Name"].toString(), line["HelpText"].toString(), line["FieldName"].toString(), line["Items"].toString().split("^"), line["Selected"], "NO", line["ExtraClass"].toString()));
break;
case "RDW":
group.appendChild(job.addOptions(line["Name"].toString(), line["HelpText"].toString(), line["FieldName"].toString(), line["Items"].toString().split("^"), line["Selected"], "DW", line["ExtraClass"].toString()));
break;
}
});
if (typeof section === "object") {
section.appendChild(group);
form.appendChild(section);
}
}
这与从上面破坏应用程序的代码完全无关。当我删除addAddress函数时,代码运行时没有任何问题,但是一旦在代码中断中添加了相同的错误。到底是怎么回事?