javascript - Wie übergebe ich Parameter in der OnChange-Ereignisbindung in JS?

Question

<input type="file" type="file" accept="image/*" onchange="previewImage" multiple/>

onchange里面填写previewImage能在previewImage函数里面获取到一个值（很多人都会写成e），里面有files，这个e是什么？
如果在onchange里面填写previewImage('segmentfault'),在previewImageIn der Funktion kann nur segmentfault abgerufen werden. Wo ist das e? Was soll ich tun, wenn ich sie gleichzeitig erhalten möchte?

Und was ist der Unterschied previewImage('segmentfault')和previewImage?

Wenn

übergeben wird previewImage, ist es nicht nur eine Referenz. Warum wird es direkt aufgerufen?

Bitte empfehlen Sie ein JS-Tutorial oder ein JS-Buch. Jetzt verwende ich nur noch JQ, Vue und verschiedene JS-Bibliotheken. . Aber wenn ich auf Probleme stoße, kann ich sie nicht immer lösen, was mich frustriert. . Wenn Sie die Grundlagen erlernen möchten, empfehlen Sie bitte dieses Buch

Answer 1

previewImage的参数可以是this,这里指的是<input>这个标签。
通过this.files来操作文件，比如this.files.length是文件的个数，this.files[index]指向对应的文件。
previewImage的参数可以是也可以是event,指的是change这个事件。

至于添加事件处理程序，可以
1.直接把js代码写在引号里，如

<input type="file" accept="image/*" onchange="alert
(event.type);" multiple/>

2.onchange = 函数名，函数声明在脚本中。如果"previewImage"不加()是不会执行的吧。

<input type="file" accept="image/*" onchange="previewImage
(this)" multiple/>
<script> function previewImage(obj){
            alert(obj.files.length);
        };</script>

3.DOM0级事件处理程序

<input type="file" accept="image/*" multiple/>
<script> document.getElementsByTagName("input")[0].onchange = function(){
            alert(event.type);
        };</script>

4.DOM2级事件处理程序

<input type="file" accept="image/*"  multiple/>
<script> document.getElementsByTagName("input")[0].addEventListener("change",function(){
            alert(event.type);
        });</script>`
或者IE7 8中为`<script> document.getElementsByTagName("input")[0].attachEvent("onchange",function(){
            alert(event.type);
        });</script>

我可能有写错的地方，最好的方法是自己实践一下。
书我看的是《JavaScript高级程序设计》第三版。

Answer 2

e表示event；
可以通过this获取相关files数据；
推荐《JavaScript高级程序设计》

Answer 3

基础js 推荐犀牛书--JavaScript权威指南（第6版）