仅在选中特定复选框时才显示“div”框
我在Wordpress插件中有下一个表单,只有当选中“Not free 1”或“Not free 2”复选框时,我才想显示带有’Price’文本字段的’div’框。 我知道这可以通过jQuery / javascript实现,但我自己无法做到这一点。 有什么建议?
UPDATE
这是我尝试过的,没有成功。
我添加了一个插件( display-price.php ):
add_action( 'wp_enqueue_scripts', 'add_my_script' ); function add_my_script() { wp_enqueue_script( 'display-price', // name your script so that you can attach other scripts and de-register, etc. WP_PLUGIN_DIR . '/display-price.js', // this is the location of your script file array('jquery') // this array lists the scripts upon which your script depends ); }
和display-price.js :
jQuery(document).ready(function($) { var advertNodes = $('#advert_category-1, #advert_category-2 '); var advertInput = $('.adverts-field-text'); advertNodes.click(function() { if (!advertNodes.is(':checked')) { advertInput.hide(); } else { advertInput.show(); } }); })
文件display-price.php和display-price.js位于同一目录(默认的Wordpress插件目录)中。
我认为选项应该是单选按钮而不是复选框。 此代码将帮助您入门:
var advertNodes = $('#advert_category-1, #advert_category-2 '); var advertInput = $('.adverts-field-text'); advertNodes.click(function() { if (!advertNodes.is(':checked')) { advertInput.hide(); } else { advertInput.show(); } });
最后,我到达了这个有效的解决方案:
// a form in a plugin (not mine): // another plugin (*display-price.php*) (this is mine) add_action( 'wp_enqueue_scripts', 'add_my_script' ); function add_my_script() { wp_enqueue_script( 'display-price', plugins_url( '/display-price.js' , __FILE__ ), array('jquery') ); } // a jQuery (*display-price.js*) to display the 'div' box with // the 'Price' text field only when the option 'Not free 1' or // 'Not free 2' are selected jQuery(document).ready(function($) { var cat = ["4", "7"]; // option values for which the price field is displayed $("#price").parent('div').hide(); $('#category').change(function(){ if($.inArray($('#category').val(), cat) > -1) { $("#price").parent('div').show(); } else { $("#price").parent('div').hide(); } }); });
display-price.php和display-price.js文件都位于同一目录(默认的Wordpress插件目录)中。