如何隔离javascript并将其绑定到特定表单

Question

I have 3 forms on one page. The first two work fine. The 3rd is below the first 2. All have unique form and ID names.

The issue is the 3rd form depends on a javascript. If I run the 3rd by itself, it runs fine. But if I have the 3rd form on the page with its script and try to run either form above, the forms above break and somehow trigger the javascript that is meant to work only with the 3rd form.

If I take the script out, all three forms work no conflicts - except I lose my upload status bar for the 3rd form.

Here is the offending script:

<script>
$(function() {
$(document).ready(function(){
    var bar = $('#bar')
    var percent = $('#percent');
    var status = $('#status');

$('form').ajaxForm({
    beforeSend: function() {
     status.empty();
    var percentVal = '0%';
    bar.width(percentVal);
    percent.html(percentVal);
    },
uploadProgress: function(event, position, total, percentComplete) {
    var percentVal = percentComplete + '%';
    percent.html(percentVal);
    bar.width(percentVal);
    },
complete: function(xhr) {
    status.html(xhr.responseText);
    }
    });
});
});
</script>

If I change this:

$('form').ajaxForm({

to this, for example

 $('aform').ajaxForm({

it disables the script and allows all the other forms to work.

I have tried:

 $('this.form').ajaxForm({

and $('document.form').ajaxForm({

I tried using the name of the form:

 $('form.[3]').ajaxForm({

But that doesn't work

and I tried using the name of the form

 $('upload').ajaxForm({
 $('form.upload').ajaxForm({
 $('form[upload]').ajaxForm({

But nothing works. The code must use the term 'form' there or the progress bar breaks

There has to be some kind of way to link that script only to the form in question so the others won't go looking for it and try to execute it