Question

我用jquery创建了动态表单。一切工作只是一个删除按钮。我无法让它发挥作用。我很确定解决方案非常简单，有人可以帮助我。我也让它在小提琴上运行：http://jsfiddle.net/tjyEH/1/

<div class="page" data-iscroll id="page">   
<script type="text/javascript">

    $('#addTilluft').click(function() {
        id = $('div#select_col select:last').attr('id');
        id = id.substr(id.indexOf("_") + 1);
        id++;
        $('<div style="height: 35px;"><select name="tilluftRoom[]" id="tilluftRoom_'+ id + '" data-mini="true" data-corners="false"><option value="val1">Val 1</option><option value="val2">Val 2</option><option value="val3">Val 3</option></select></div>').appendTo('#select_col');
        $('<div style="height: 36px;"><input id="tilluftValue_' + id + '" name="tilluftValue[]" data-mini="true" data-corners="false"></div>').appendTo('#input_col');
        $('<div style="height: 31px;"><a href="#" id="removeTilluft_'+id+'" onclick="Removetilluft(this.id)" data-role="button" data-icon="delete" data-iconpos="notext">Delete</a></div>').appendTo('#remove_col');

        $("#tilluftRoom_" + id).selectmenu();
        $("#removeTilluft_" + id).button();
        $("#tilluftValue_" + id).textinput();
        $("#tilluftRoom_" + id).selectmenu('refresh');          
        $("#removeTilluft_" + id).button('refresh');          
        $("#tilluftValue_" + id).textinput('refresh');          

   });


   function Removetilluft(id) { 
       id = id.substr(id.indexOf("_") + 1);

       $('#tilluftRoom_' + id).remove();
       $('#tilluftValue_' + id).remove();
       $('#removeTilluft_' + id).remove();



   };
 </script>     

               <form action="<?=base_url()?>index.php/welcome/showinput" method="post" data-ajax="false" id="tilluft_form"> 
                  <div id="tilluft"> 
                  <h3>Tilluft</h3>
                        <div id="select_col" class="ui-block-a">
                            <div style="height: 35px;">
                             <select name="tilluftRoom[]" id="tilluftRoom_1" data-mini="true" data-corners="false">
                                <option value="val1">Val 1</option>
                                <option value="val2">Val 2</option>
                                <option value="val3">Val 3</option>
                                <option value="val4">Val 4</option>    
                                <option value="val5">Test</option>    
                             </select> 
                            </div>
                        </div>
                        <div id="input_col" class="ui-block-b">
                             <div style="height: 36px;">
                              <input name="tilluftValue[]" id="tilluftValue_1" data-mini="true" data-corners="false">
                             </div>
                        </div>
                        <div id="remove_col" class="ui-block-c" style="width:35px;">
                             <div style="height: 28px;">
                              <a href="#" id="removeTilluft_1" onclick="Removetilluft(this.id)"data-role="button" data-icon="delete" data-iconpos="notext">Delete</a> 
                             </div>
                        </div>

                         <a id="addTilluft"  href="#" data-role="button" data-icon="add" data-mini="true" data-inline="true" data-corners="false">Add one more</a> 

                  </div>


               </form>   
               <input type="submit" form="tilluft_form" value="Submit Form" data-mini="true" data-inline="true" data-corners="false"/>
          </div>

Answer 1

Removetilluft(id) { is defined in `$(window).load(function(){`. Therefor it is not defined as global variable and can't be found by your onclick function

使Removetilluft全球化如下：window.Removetilluft = Removetilluft;

$(window).load(function(){

....    

       function Removetilluft(id) { 
           id = id.substr(id.indexOf("_") + 1);

           $('#tilluftRoom_' + id).remove();
           $('#tilluftValue_' + id).remove();
           $('#removeTilluft_' + id).remove();      
       };
});

Jquery remove不删除元素

1 个答案: