Multilevel-Zitat in JavaScript?

Question

OK, dann ist dies vielleicht dümmste Frage immer aber mit mir tragen ....

Wie diese Arbeit zu machen:

$("#basephoto").after(
    '<tr><td valign="bottom">Additional photo:</td> 
     <td>&nbsp;&nbsp;&nbsp;</td> 
     <td><div id="addphoto'+curupfld+'" class="browsebg"> 
     <p class="bpath"></p> 
     <input onchange="fillBrowse(\"#addphoto'+curupfld+'\",this); validateExt(field);" class="browse transfield" type="file" name="altphoto'+curupfld+'" size="40" /> 
     <span onclick="delImgField(this.id)" id="delbtn'+curupfld+'" class="abuttons delbtn"></span></div> 
     </td> 
    </tr>'); 

Der Teil von Interesse:

onchange="fillBrowse(\"#addphoto'+curupfld+'\",this); validateExt(field);" 

Das Problem beginnt bei der "onchange". Ich kann immer eine Funktion machen, dass diese beiden und die Lösung nennt wäre:

$("#basephoto").after(
    '<tr> 
    <td valign="bottom">Additional photo:</td> 
    <td>&nbsp;&nbsp;&nbsp;</td> 
    <td> 
     <div id="addphoto'+curupfld+'" class="browsebg"> 
     <p class="bpath"></p> 
     <input onchange=functionCaller("#addphoto'+curupfld+'",this) class="browse transfield" type="file" name="altphoto'+curupfld+'" size="40" /> 
     <span onclick="delImgField(this.id)" id="delbtn'+curupfld+'" class="abuttons delbtn"></span> 
     </div> 
     </td> 
    </tr>'); 

Dies funktioniert, aber wenn möglich, möchte ich das Problem zu lösen, anstatt nur eine Abhilfe Methode zu verwenden.

Answer 1

ich wirklich nicht wissen, was Sie wirklich tun. Aber wenn Sie nur wan't es schreiben in einem jQuery Weg .. Dies können helfen ..

$('#basephoto').append('<tr />'); 
$('#basephoto tr').append(
    $('<td />') 
     .attr('valign','bottom') 
     .html('Additional photo:') 
); 
$('#basephoto tr').append(
    $('<td />') 
     .html('&nbsp;&nbsp;&nbsp;') 
); 
$('#basephoto tr').append(
    $('<td />') 
     .html(
      $('<div />') 
      .attr({ 
       "id":"addphoto-"+curupld, 
       "class":"browsebg" 
      }) 
      .html(
       $('<p />') 
        .attr('class','bpath') 
        .html('') 
      ) 
     ) 
); 
$('#addphoto-'+curupfld).append(
    $('<input />') 
     .attr({ 
      "class":"browse transfield", 
      "type":"file", 
      "name":"altphoto-"+curupfld, 
      "size":"40" 
     }) 
     .change(function(){ 
      functionCaller('#addphoto-'+curupfld,this); 
      validateExt(field); 
     }) 
); 
$('#addphoto-'+curupfld).append(
    $('<span />') 
     .attr({ 
      "class":"abuttons delbtn", 
      "id":"delbtn-"+curupfld 
     }) 
     .click(function(){ 
      delImgField($(this).attr('id')); 
     }) 
); 

Schauen Sie sich diesen Beitrag mehr zu wissen, wie Elemente erstellen mit jQuery:

• http://mongsang-ga.tumblr.com/post/19914049827/how-to-create-a-element-in-jquery

ich Ihnen nur raten brauchen eine Zeile wie diese fügen Sie dann Ihre Problem zu beheben:

$('#input_that_has_the_change_event').change(function(){ 
    fillBrowse('#addphoto'+curupfld,this); 
    validateExt(field); 
}); 

* PS .: Sagen Sie nicht, dass es dumm ist. Ich bin genau wie du vor ..:]

Answer 2

Verwenden Sie ein Vorlagensystem wie Unterstrich. Wartbar und einfacher zu lesen/zu beheben.

http://documentcloud.github.com/underscore/

Beispiel:

<script id="templateA" type="text/template"> 
      <p> 
       Test stuff <a href="/home.html"><%= label %></a> 
       ... 
      </p> 
    </script> 
... 

<script type="javascript"> 
     var templateFunction = _.template($('#templateA').html()); 
     $('#someDivID').after(templateFunction({label: 'Here'})); 
</script>