getElementById从WP返回空变量

Question

所以我有这个基于WordPress标准编码的小部件。我宣布了一种变量来同时使用后端和前端的目的。

public function widget($args, $instance) { 

    global $post; 

    $sid = $instance['id']; 

    $name = $instance['name']; 

    $args = array('post_type' => 'content_manager','post_id' => $sid); 

    $query = new WP_Query($args); 

    echo $args['before_widget']; 

    echo $args['after_widget']; 

} 

public function form($instance) { 

    global $post; 

    $args = array('post_type' => 'content_manager'); .... 



    $loop = new WP_Query($args); 

    $title = ! empty($instance['title']) ? $instance['title'] : esc_html__('New title', 'text_domain'); 

    $sid = ! empty($instance['id']) ? $instance['id'] : esc_html__('New ID', 'text_domain'); 

    $name = ! empty($instance['name']) ? $instance['name'] : esc_html__('Empty Content', 'text_domain'); 

我使用的变量可以在javascript中的值

<script> 

     function defineValue(sel) 
     { 
      var title = sel.options[sel.selectedIndex].text; 
      var id = sel.options[sel.selectedIndex].value; 
      document.getElementById("<?php echo esc_attr($this->get_field_id('title')); ?>").value = title; 
      document.getElementById("<?php echo esc_attr($this->get_field_name('id')); ?>").value = id; 
      document.getElementById("<?php echo esc_attr($this->get_field_name('name')); ?>").value = title; 
     } 

    </script> 

当我加载控件，输入和其他选项显示的名称和ID，但在Javascript返回空，除非如果我救它首先。

我试图测试

<?php echo esc_attr($this->get_field_name('id')); ?> 

，这是结果

widget-content-loader-__i__-id 

这是为什么发生？

注：

首先输入等元素有ID和其他属性的变量当我检查的DOM

<input class="widefat" name="widget-content-loader[21][title]" id="widget-content-loader-21-title" value="New title" type="text"> 

从这个这个脚本：

<input 
     class="widefat" 
     name="<?php echo esc_attr($this->get_field_name('title')); ?>" 
     type="text" 
     id="<?php echo esc_attr($this->get_field_id('title')); ?>" 
     value="<?php echo esc_attr($title); ?>"> 

谢谢提前

Answer 1

Javascript不能获取值，除非它被加载到DOM ， 请确保在调用definevalue（）之前加载元素（）