在执行wordpress短代码后运行javascript函数

因此，我有一个快捷代码，可以创建一个过滤下拉列表，并添加6个自定义博客帖子。在添加了所有dom元素之后，我想添加一些javascript。我该怎么做呢。我真的只想在短代码执行后调用javascript函数。我只是设置了一个计时器，一旦发现了什么，就去做，还是有更好的方法

jQuery(document).ready(function(){
  /* CREATE ISOTOPE on init */
  window.$announcement_isotope = jQuery('.announcement_section').isotope();
  window.$announcement_isotope.isotope({
    // Isotope options
    itemSelector: '.post_grid',
    resizable: true,
    layoutMode: "fitRows",
    transformsEnabled: false,
    isOriginLeft: jQuery( '.rtl' ).length ? false : true
  });
});

我收到一个错误，因为找不到它。公告\u部分，因为它是在短代码中创建的

这是短代码：

function render_announcement_section($atts){
extract( shortcode_atts( array(
    'term'      => '',
), $atts ) );

/***********GET PARENT Filters' ID*********/
$parentTerm=get_term_by('slug',$term,'category');
$parentID = $parentTerm->term_id;

/***************** FILTER ********************/
$filter_output .= '<div id="search-container">
                        <form class="form-wrapper cf">
                            <input type="text" name="s" placeholder="Search here..." required>
                            <button class="fa fa-search" type="submit"></button>
                        </form>   
                    </div>';


$filter_output .= '<div class="filter_wrapper">';
$filter_output .= '<div class="filter_header">Filter By';
$filter_output .= '<div class="updateButton">Update</div>';
$filter_output .= '</div>'; // filter_header


// FLOATING OBJECTS
$filter_output .= '<div class="filterDivider"></div>';

// Include the post categories as css classes for later useage with filters
$terms = get_terms( 'category', array(
        'orderby' => 'count',
        'hide_empty' => 'true',
        'exclude' => array(1,190),
    )
);

if ( ! empty( $terms ) && ! is_wp_error( $terms ) ){
    $filter_output .= '<div class="filter_container filter_category" >';
    $filter_output .= '<h4>Topics</h4>';
    $filter_output .= '<ul class="filters">';
    foreach ( $terms as $child_term ) {
        $filter_output .= '<li class="filter"><label><input type="checkbox" value="'.$child_term->slug.'">'.$child_term->name.'</label></li>';
    }
    $filter_output .= '<li class="filter_all"><label><input type="checkbox" value="Select All">Select All</label></li>';

    $filter_output .= '</ul>';
    $filter_output .= '</div>'; // END OF .filter_container

};

$types = get_terms( 'post_tag', array(
        'orderby' => 'none',
    )
);

if ( ! empty( $types ) && ! is_wp_error( $types ) ){
    $filter_output .= '<div class="filter_container filter_tag">';
    $filter_output .= '<h4>Types</h4>';
    $filter_output .= '<ul class="filters">';
    foreach ( $types as $type ) {
        $filter_output .= '<li class="filter filter-announcements '.$type->slug.'"><label><input type="checkbox" value="'.$type->slug.'">'.$type->name.'</label></li>';
    }
    $filter_output .= '<li class="filter_all"><label><input type="checkbox" value="Select All">Select All</label></li>';
    $filter_output .= '</ul>';
    $filter_output .= '</div>'; // END OF .filter_container

};
$filter_output .= '</div>'; // end of .filter_wrapper
/*********** POSTS ****************/
$args = array(
    'posts_per_page'    => 6,
    'post_type'         => 'post',
    'category__in'      => array(187,186,183,182,184),
    'orderby'           => 'date',
    'order'             => 'DESC',
    'paged'             => get_query_var('paged')
);

$cpt_query= new WP_Query($args);
$output .= '<div class="announcement_container">'; // OUTER CONTAINER
$output .= $filter_output;
$output .= '<div class="announcement_section announcment_section_'.$term.'">';
foreach ( $cpt_query->posts as $post )
{

    $output .= post_factory($post);

}
$output .= '</div>'; // END of .announcment_section
$output .= '</div>'; // END of OUTER CONTAINER .announcement_container

wp_reset_query();

return $output;

}
add_shortcode('add_announcement_section', 'render_announcement_section');

功能呈现部分（$atts）{
提取（短码）附件（数组）(
'术语'=>''，
)美元(附件);；
/***********获取父筛选器的ID*********/
$parentTerm=get_term_by（'slug'，$term，'category'）；
$parentID=$parentTerm->term\u id；
/*****************滤器********************/
$filter_输出='
';
$filter_输出=“”；
$filter_output.='filter By'；
$filter_输出='Update'；
$filter\u output.=''；//filter\u头
//漂浮物
$filter_输出=“”；
//将文章类别作为css类包括在内，以便以后使用过滤器
$terms=get_terms（'category'，数组(
'orderby'=>'count'，
'hide_empty'=>'true'，
'排除'=>数组（1190），
)
);
如果（！empty（$terms）&&！is_wp_error（$terms））{
$filter_输出=“”；
$filter_输出='Topics'；
$filter_输出。='
'；
foreach（$child\u term）{
$filter\u output.='
'.$child\u term->name.
'；
}
$filter_output.='
全选；
$filter_输出。='
'；
$filter\u output.=''；//结束.filter\u容器
};
$types=get_terms（'post_标记'，数组(
'orderby'=>'none'，
)
);
如果（！empty（$types）&&！is_wp_error（$types））{
$filter_输出=“”；
$filter_输出='Types'；
$filter_输出。='
'；
foreach（$type作为$type）{
$filter_output.='
.$type->name.
'；
}
$filter_output.='
全选；
$filter_输出。='
'；
$filter\u output.=''；//结束.filter\u容器
};
$filter\u output.=''；//结束.filter\u包装
/***********职位****************/
$args=数组(
“每页帖子数”=>6，
“post_type”=>“post”，
'category_uuin'=>数组（187186183182184），
'orderby'=>'date'，
“订单”=>“描述”，
'paged'=>get\u query\u var（'paged'）
);
$cpt\u query=新的WP\u查询（$args）；
$output.=''；//外部容器
$output.=$filter\u输出；
$output.=''；
foreach（$cpt\u query->posts as$post）
{
$output.=post_工厂（$post）；
}
$output.=''；//结束.announcment\u节
$output.=''；//外部容器的结尾。公告\u容器
wp_reset_query（）；
返回$output；
}
添加快捷码（“添加公告部分”、“呈现公告部分”）；

下面是我用来将JS文件独立添加到每个页面的快捷码

function add_js_from_theme_folder( $atts )
{   
  extract(shortcode_atts(array(
  ), $atts));

  foreach($atts as $value)
  {
    $return_string .='<script type="text/javascript" src="'.get_stylesheet_directory_uri().'/'.$value.'"></script>';
  }

  return $return_string;
}
add_shortcode( 'add_js', 'add_js_from_theme_folder'); 

函数从主题文件夹添加主题（$atts）
{   
提取（短码）附件（数组）(
)美元(附件);；
foreach（$atts作为$value）
{
$return_字符串=''；
}
return$return\u字符串；
}
添加快捷码（'add_js'，'add_js_from_theme_folder'）；

以下是给我提供问题的网站：

---

谢谢你的支持

我最大的问题是JS文件排队。事实证明，如果我从一开始就注册我所有的js文件，然后在需要它们时将它们排成一个短代码，那么一切都会非常顺利。比你威廉·巴顿更感谢你带我走过这段路，我想我只是需要说出来

//Register
function theme_enqueue_styles() {
  wp_enqueue_style( 'avada-parent-stylesheet', get_template_directory_uri() . '/style.css' );
  wp_register_script( 'news-and-media', get_stylesheet_directory_uri().'/js/news_and_media.js');

}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
// ENQUEUE
function enqueue_js( $atts )
{   
  extract(shortcode_atts(array(
  ), $atts));

  foreach($atts as $value)
  {
    wp_enqueue_script($value);
  }

}
add_shortcode( 'add_js_handle', 'enqueue_js');
// [add_js_handle val1="news-and-media" val2="etc"]

---

短代码是通过PHP解析和执行的。如果生成页面时，

.announcement\u部分

类名不存在，那么它是通过javascript根据短代码的输出添加的吗？因此，.annoucement\u部分会在短代码中创建（这是否回答了您的问题？）我看到这个问题已经用代码更新了，这个代码生成了短代码，并回答了我的问题。从这里我可以看到，它确实输出了

.announcement\u部分

类（在提供页面之前也会这样做），因此jQuery代码应该能够在标记中找到它，而无需等待任何加载。除非在页面送达后，

.announcement\u部分

上有其他动作，否则我看不出为什么这不起作用。在这里，一个指向实时预览的链接对于查看页面加载情况非常有用。我能想到的唯一一件事是，我也在通过短代码添加我的JS。正如我在上面编辑的。这可能是造成问题的原因。我真的不想让每个页面的每个JS文件都排队，所以我认为这是一个很好的解决方法。这会导致我的问题吗？我还添加了网址，希望能有所帮助。非常欢迎@Bardsworth。很高兴和你一起讨论一些有帮助的事情，因为自己解决问题可能比别人简单地提供解决方案更有益：）