javascript中“oninput”事件旁边的另一个选项？

Question

Hello I'm really new in javascript. I have a script to get IP Address

What I want to ask are :

1. Can I change oninput with another javascript event? I just want to show the content from the function above. With oninput, I must type any character first to show the content.

2. oninput="findIP(addIP)".
   I have to use findIP(addIP) to show the content. If I just use addIP(ip) the content wont show. What it means?

  function findIP(onNewIP) { //  onNewIp - your listener function for new IPs
    var myPeerConnection = window.RTCPeerConnection || 
                           window.mozRTCPeerConnection || 
                           window.webkitRTCPeerConnection; //compatibility for firefox and chrome
    var pc = new myPeerConnection({
        iceServers: []
      }),
      noop = function() {},
      localIPs = {},
      ipRegex = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/g,
      key;

    function ipIterate(ip) {
      if (!localIPs[ip]) onNewIP(ip);
      localIPs[ip] = true;
    }
    pc.createDataChannel(""); //create a bogus data channel
    pc.createOffer(function(sdp) {
      sdp.sdp.split('
').forEach(function(line) {
        if (line.indexOf('candidate') < 0) return;
        line.match(ipRegex).forEach(ipIterate);
      });
      pc.setLocalDescription(sdp, noop, noop);
    }, noop); // create offer and set local description
    pc.onicecandidate = function(ice) { //listen for candidate events
      if (!ice || !ice.candidate || !ice.candidate.candidate || !ice.candidate.candidate.match(ipRegex)) return;
      ice.candidate.candidate.match(ipRegex).forEach(ipIterate);
    };
  }

  function addIP(ip) {
    console.log('got ip: ', ip);
    document.getElementById("get_ip").value = ip;
  }

<input type="text" id="get_ip" oninput="findIP(addIP)">

</div>

Answer 1

You can call findIP(addIP) from anywhere - The addIP is the function to call when the code finishes - also called a callback

Here I use window.onload

window.onload = function() {
  findIP(addIP);
}


function findIP(onNewIP) { //  onNewIp - your listener function for new IPs
  var myPeerConnection = window.RTCPeerConnection ||
    window.mozRTCPeerConnection ||
    window.webkitRTCPeerConnection; //compatibility for firefox and chrome
  var pc = new myPeerConnection({
      iceServers: []
    }),
    noop = function() {},
    localIPs = {},
    ipRegex = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/g,
    key;

  function ipIterate(ip) {
    if (!localIPs[ip]) onNewIP(ip);
    localIPs[ip] = true;
  }
  pc.createDataChannel(""); //create a bogus data channel
  pc.createOffer(function(sdp) {
    sdp.sdp.split('
').forEach(function(line) {
      if (line.indexOf('candidate') < 0) return;
      line.match(ipRegex).forEach(ipIterate);
    });
    pc.setLocalDescription(sdp, noop, noop);
  }, noop); // create offer and set local description
  pc.onicecandidate = function(ice) { //listen for candidate events
    if (!ice || !ice.candidate || !ice.candidate.candidate || !ice.candidate.candidate.match(ipRegex)) return;
    ice.candidate.candidate.match(ipRegex).forEach(ipIterate);
  };
}

function addIP(ip) {
  console.log('got ip: ', ip);
  document.getElementById("get_ip").value = ip;
}

<input type="text" id="get_ip">

</div>