如何添加代碼的PHP腳本

Question

當點擊.button - >追加{HTML + PHP代碼}內樣品UL

<script> 

$(document).ready(function(){ 
    $('.button').on("click", function() { 
     $('.ul').append('<li>'+ about 100 lines HTML + PHP codes+'</li>'); 
    } 
}); 

</script> 

/*當點擊這個按鈕做一些事情*/

<button class="button">button</button> 

/*追加（）內該UL標籤*/

<ul> 

</ul> 

---

這樣的東西...

jQuery(document).ready(function() { 

     var count = 0; 
     var button = jQuery('.add-module'); 
     var sample = jQuery('.sample-page-builder'); 
     var geturi = '<?php echo get_template_directory_uri(); ?>'; 
     var category = '<?php foreach ($terms as $term){ echo '<option value="'. $term->slug .'">'. $term->name .'</option>'; } ?>'; 

     button.live('click', function() { 

      sample.append('<li class="apanel"><div class="apanel-head"><?php _e('Module Title', 'sample'); ?></div><div class="apanel-body"><div class="apanel-content"><label for="sample_page_builder['+ count +'][title]" class="apanel-label"><?php _e('Module Title', 'sample'); ?></label><input type="text" id="sample_page_builder['+ count +'][title]" name="sample_page_builder['+ count +'][title]" value="" size="150"></div><div class="apanel-content"><label for="meta-radio-1" class="apanel-label"><?php _e('Module Layout', 'sample'); ?></label><ul class="radio-images"><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-1" value="" /><img src="'+ geturi +'/assets/img/module-1.png" alt="Layout 1"></label></li><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-2" value="" /><img src="'+ geturi +'/assets/img/module-2.png" alt="Layout 2"></label></li><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-3" value="" /><img src="'+ geturi +'/assets/img/module-3.png" alt="Layout 3"></label></li><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-4" value="" /><img src="'+ geturi +'/assets/img/module-4.png" alt="Layout 4"></label></li><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-5" value="" /><img src="'+ geturi +'/assets/img/module-5.png" alt="Layout 5"></label></li><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-6" value="" /><img src="'+ geturi +'/assets/img/module-6.png" alt="Layout 6"></label></li><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-7" value="" /><img src="'+ geturi +'/assets/img/module-7.png" alt="Layout 7"></label></li><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-8" value="" /><img src="'+ geturi +'/assets/img/module-8.png" alt="Layout 8"></label></li><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-9" value="" /><img src="'+ geturi +'/assets/img/module-9.png" alt="Layout 9"></label></li><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-10" value="" /><img src="'+ geturi +'/assets/img/module-10.png" alt="Layout 10"></label></li><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-11" value="" /><img src="'+ geturi +'/assets/img/module-11.png" alt="Layout 11"></label></li><li><input type="radio" name="sample_page_builder['+ count +'][layout]" id="meta-radio-12" value="" /><img src="'+ geturi +'/assets/img/module-12.png" alt="Layout 12"></label></li></ul></div><div class="apanel-content"><label for="sample_page_builder['+ count +'][number]" class="apanel-label"><?php _e('Max Number of Post', 'sample'); ?></label><input type="text" id="sample_page_builder['+ count +'][number]" name="sample_page_builder['+ count +'][number]" value=""></div><div class="apanel-content"><label for="sample_page_builder['+ count +'][offset]" class="apanel-label"><?php _e('Posts Offset', 'sample'); ?></label><input type="text" id="sample_page_builder['+ count +'][offset]" name="sample_page_builder['+ count +'][offset]" value=""></div><div class="apanel-content"><label for="sample_page_builder['+ count +'][order]" class="apanel-label"><?php _e('Order Posts by', 'sample'); ?></label><select name="sample_page_builder['+ count +'][order]" id="sample_page_builder['+ count +'][order]"><option value="date">Order by Date</option><option value="title">Order by Title</option><option value="rand">Random Order</option><option value="comment_count">Number of Comments</option></select></div><div class="apanel-content"><label for="sample_page_builder['+ count +'][category]" class="apanel-label"><?php _e('Filter by Category', 'sample'); ?></label><select name="sample_page_builder['+ count +'][category]" id="sample_page_builder['+ count +'][category]">'+ category +'</select></div><input id="sample_page_builder['+ count +'][id]" name="sample_page_builder['+ count +'][id]" value="" type="hidden" /></div></li>'); 

      count++; 

     }); 

    }); 

其真正的方式來追加php + html代碼時點擊按鈕？ 這是如何與jQuery的Ajax工作，（在腳本標記/文件中使用php數組）？ 這與json的工作（從其他文件獲取php代碼）？ 我應該怎麼做才能避免spageti代碼？ 謝謝！

Answer 1

您不能在JavaScript中追加PHP代碼。 PHP是一種服務器端語言，因此它需要在服務器上執行，而JavaSript在客戶端（在用戶的瀏覽器中）執行。

因此，如果您附加了PHP代碼，那麼最終用戶只能看到源代碼。

Answer 2

你可以像下面這樣做

$(function(){ 
    $(".button").on("click",function(){ 
     $('.ul').append('<li>'+ "<h1>HTML CODE </h1>" + '<?php $array = ["array1", "array2"]; echo("PHP CODE - " . $array[0]); ?>' + '</li>'); 
    }); 
}); 

*

<button class="button">button</button> 
<ul class = "ul"></ul>