单击外部文件中未触发的事件
click event not triggered in the external file
我试图创建一个库代码,可以跨我所有的html页面使用。我是JS的新手,这是我第一次尝试编写像库函数一样的代码。
我有一个文本字段和旁边的按钮,点击按钮,这添加了另一个文本字段下面和旁边的按钮,这也删除了前一行的按钮。
我设法在同一行做一个按钮,并在下一行添加文本字段,但是按钮单击新添加的方法不与纯JS一起工作,所以我试图使用jquery"on"单击事件。由于某些原因,我的情况没有被触发。不知道我错过了什么。
外部文件代码
var addAnother = {
addAnotherField: function (eventTrigger, fieldContainer, arrayField) {
console.log("called");
var eventTrigger = eventTrigger;
console.log("ready called", eventTrigger);
$(document).on('click', eventTrigger, function (e) {
console.log("click called");
var buttonText = this.value;
var div = document.getElementById(fieldContainer);
var element = document.getElementById(eventTrigger);
element.parentNode.removeChild(element);
var input = document.createElement("input");
input.type = "text";
input.name = arrayField;
div.appendChild(document.createElement("br"));
div.appendChild(input);
var button = document.createElement("input");
button.type = "button";
button.id = eventTrigger;
button.value = buttonText;
div.appendChild(button);
});
}
}
$(document).ready(function () {
addAnother.addAnotherField("addAnother", "addAnotherContainer", "fieldArray[]");
});
JS工作代码:http://jsfiddle.net/balasivagnanam/ekoob8f0/
next按钮不工作代码JShttp://jsfiddle.net/balasivagnanam/ukseeuak/
与Jquery:http://jsfiddle.net/balasivagnanam/6ea2dk6m/
这是你想要的吗:
/** this part will be located in another file added as a js library */
function addAnother(elem) {
var text = $("#addAnotherField").clone();
$("<br/>").insertBefore($("#addAnother"));
text.insertBefore($("#addAnother"));
}
/* this part will be coded below the above code file in the html file*/
$(document).ready(function () {
$('#addAnother').click(function () {
addAnother(this);
});
});
这里是JSFiddle演示
相关文章:
- 从Phaser游戏JS向外部JS触发事件
- 删除外部事件时获取完整日历上的资源 ID
- 你能用onblur事件调用一个外部Javascript吗
- 如何访问Bokeh's数据并从外部触发前端上的事件
- 如何使鼠标事件仅适用于外部DIV
- 捕获元素jquery外部的mousedown事件
- 如何从加载的JSON文件构建外部事件列表
- 带有标签的外部链接会延迟滚动事件
- 只有在单击外部li时才会触发的事件
- 您可以从方法外部识别事件的调用方吗
- 取消绑定由加载jQuery'的外部脚本添加的事件;s的getScript函数
- 在元素外部单击时激发事件的指令
- 用于动态加载外部JS的任何javascript事件
- 如何在使用 jQuery Mobile 外部页面链接时绑定未来事件
- 如何将来自外部 PHP 页面的内容包含在带有 onlick 事件的 DIV 中
- 完整日历删除外部事件
- 如何在 cy 外部获取我的元素数据以进行事件
- 谷歌分析跟踪事件(外部链接)
- 到达事件外部的方法
- 如何使用click事件外部的函数访问模态中的输入值