Question

I’ve a script:

<form id="myform">
    <input type="text" value="" id="input1">
    <input type="text" value="" id="input2">
    <input type="submit" value="submit">
</form>
<img id="image" src="http://mydomain.com/empty.gif" />
<script>
$(document).ready(function () {
    $("#myform").submit(function (ev) {
        ev.preventDefault();
        var val1 = $("#input1").val();
        var val1 = $("#input2").val();
        $("#image").attr("src", "http://mydomain.com/image?val1="+val1+"&val2="+val2);
    });
});
</script>

How would it look like if written in JavaScript?

Answer 1

<img id="image" src="http://mydomain.com/empty.gif" />
<script>
window.onload = function() { // Not all browsers support DOMContentLoaded
  document.getElementById("myform").onsubmit = function() {
     var val1 = document.getElementById("input1").value;
     var val2 = document.getElementById("input2").value;
     document.getElementById("image").src="http://mydomain.com/image?val1="+val1+"&val2="+val2;
     return false;
   };
};
</script>

If you NAME the fields you can use

window.onload = function() {
  document.getElementById("myform").onsubmit = function() {
     document.getElementById("image").src="http://mydomain.com/image?val1="+this.input1.value+"&val2="+this.input2.value;
     return false;
   };
};

You MAY want to escape the two values