jQuery用戶界面可排序似乎不能在管理器工具中工作

我正在創建我的第一個WordPress窗口小部件，並且在管理窗口小部件頁面中使用jQuery UI可排序時出現問題。jQuery用戶界面可排序似乎不能在管理器工具中工作

從我在研究中看到的，WordPress已經包含jquery（和jquery ui庫），但爲了使用它，我必須使用wp_enqueue_script。

我做了哪些。

但只有一些jQuery代碼的作品。 jquery ui可排序不起作用。

這裏是我的abc_categories_widget.js

jQuery(document).ready(function() { 
    // The following doesn't seem to be working 
    jQuery("#abc_product_categories_sortable").sortable({ 
     cursor: 'move' 
    }); 

    // The below statements work as expected 
    jQuery('#abc_product_categories_sortable').disableSelection(); 
    jQuery('#abc_product_categories_sortable li').disableSelection(); 
});

下面是相關的代碼我的小部件

function form($instance) { 
     wp_enqueue_script('abc_categories_widget_js', plugin_dir_url(__FILE__) . 'abc_categories_widget.js', array('jquery','jquery-ui-sortable'), '1.0', true); 
     wp_enqueue_style('abc_categories_widget_css', plugin_dir_url(__FILE__) . 'css/jquery-ui-1.8.21.custom.css'); 

     $abc_categories = $instance['abc_product_categories']; 

     global $wpdb; 
     $product_categories = $wpdb->get_results('SELECT * FROM ' . $wpdb->prefix . 'abc_categories', ARRAY_A); 
?> 
     <ul id="abc_product_categories_sortable" class="ui-sortable"> 
     <?php foreach($product_categories as $a_category) { ?> 
      <li id="<?php echo 'cid_' . $a_category['category_id']; ?>" class="ui-state-default" style="padding:5px 10px"><?php echo $a_category['category_name']; ?></li> 
     <?php } ?> 
     </ul> 
<?php 
    } 
}

任何人都知道可能是什麼問題？

來源

2012-07-06 Charalampos Anargyrou

使用螢火在<div>

即包裝<ul>解決我的問題，看看最新的JavaScript錯誤你有.. – 2012-07-06 12:23:52

在螢火蟲沒有JavaScript錯誤 – 2012-07-06 12:48:07

我設法在PHP代碼

<div id="abc_product_categories_sortable"> 
     <ul id="abc_product_categories_sortable_list" class="ui-sortable"> 
     <?php foreach($product_categories as $a_category) { ?> 
      <li id="<?php echo 'cid_' . $a_category['category_id']; ?>" class="ui-state-default" style="padding:5px 10px"><?php echo $a_category['category_name']; ?></li> 
     <?php } ?> 
     </ul> 
<div>

，並在我的javascript代碼

jQuery(document).ready(function() { 
    jQuery("#abc_product_categories_sortable ul").sortable({ 
     cursor: 'move' 
    }); 

    jQuery('#abc_product_categories_sortable ul').disableSelection(); 
    jQuery('#abc_product_categories_sortable li').disableSelection(); 
});

來源

2012-07-07 06:31:53

jQuery用戶界面可排序似乎不能在管理器工具中工作

回答

相關問題