多个事件的单个事件侦听器

时间:2019-11-10 15:33:21

标签: javascript conditional-statements event-listener

我有一个JS函数,它添加了可变数量的部分。在每个部分中,我都有一个ID和名称设置为“ type _” + i的输入,其中i是该部分的索引

 var input=document.createElement('select');
                            input.id ="type_" + i
                            input.name="type_" + i
                            input.required = true 
                            input.classList.add("selects")
                            myPre.appendChild(input);
                            var myInput = document.getElementById('type_' + i)
                            var prefix = document.createTextNode('Media Type      : ')
                            myInput.parentNode.insertBefore(prefix, myInput);
                            var option = document.createElement("option");
                            option.text = "";
                            myInput.add(option);
                            var option = document.createElement("option");
                            option.text = "IMAGE";
                            myInput.add(option);
                            var option = document.createElement("option");
                            option.text = "VIDEO";
                            myInput.add(option);
                            var option = document.createElement("option");
                            option.text = "IFRAME";
                            myInput.add(option);

这是输入屏幕。根据选择的选项(图像,视频或IFRAME),我需要上传图像或视频文件或输入IFRAME的链接

这是用于文件上传的条件JS

                            var input=document.createElement('input');
                            input.type="file";
                            input.id ="mediaSec_" + i
                            input.name ="mediaSec_" + i
                            input.required = true 
                            input.classList.add("files")
                            myPre.appendChild(input);
                            var myInput = document.getElementById('mediaSec_' + i)
                            var prefix = document.createTextNode('   Upload Media    : ')
                            myInput.parentNode.insertBefore(prefix, myInput);
                            //var br = document.createElement('BR')
                            //myInput.insertAdjacentElement("afterend", br);

这是有条件的JS添加链接地址

var input=document.createElement('input');
                            input.type="text";
                            input.id ="link_" + i
                            input.name ="link_" + i
                            input.classList.add("links")
                            input.placeholder = "add iframe https://" 
                            myPre.appendChild(input);
                            var myInput = document.getElementById('link_' + i)
                            var prefix = document.createTextNode('   Link Address : ')
                            myInput.parentNode.insertBefore(prefix, myInput);
                            var br = document.createElement('BR')
                            myInput.insertAdjacentElement("afterend", br);

我需要在单独的功能中执行此操作吗?我可以只用一个听众来做,还是每个部分都需要一个听众?我该如何传递ID?

1 个答案:

答案 0 :(得分:0)

不确定单个事件侦听器对多个事件的含义是什么。我想您的意思是处理事件发生的处理程序?如果我的假设是正确的,那么可以的,您可以做一个处理程序,然后可以检查提交的文件/输入的类型。如果它的类型为image / jpeg,则可以触发图像的输入..如果它的视频为视频,则其字符串为iframe