Question

我有这个选择器尝试：

<textarea tinymce="basicoptions"></textarea>
<textarea tinymce="advancedoptions"></textarea>
<script language="javascript" type="text/javascript">
$(document).ready(function(){
   $('textarea[tinymce]').each(function(){ 
   var tinymceopts = $(this).attr('tinymce');
   $(this).tinymce(tinymceopts); 

});
</script>

简单地说，我正在使用我的自定义属性，名为tinymce来保存一个字符串，这是我存储在javascript文件中的变量的名称。
（javascript文件中的示例：var basicoptions = { ....stuff.... } 在该变量内部保存了tinymce编辑器的自定义选项。

上面的代码不起作用。但是如果我用其中一个实际变量替换$(this).tinymce(tinymceopts);：$(this).tinymce(basicoptions);它可以正常工作。

我实际上有4个变量可以使用，但我上面只显示了2个。

有更好的方法吗？

Answer 1

在重新阅读你的问题之后好了，听起来你只需要访问一个名称与属性相似的变量。假设它是一个全局变量，可以这样做：

$(document).ready(function(){
   $('textarea[tinymce]').each(function(){ 
   var tinymceopts = $(this).attr('tinymce');
   $(this).tinymce(window[tinymceopts]); 
});

您现在引用的变量tinymce应该映射到您的window.basicoptions变量，而不是将字符串'basicoptions'传递给var basicoptions方法，假设范围确实在全球水平。如果不是，只需将window替换为适用的命名空间。

Answer 2

这似乎不是关于jQuery属性选择器，甚至jQuery的问题。

根据我的理解，你已经为编辑器创建了四个带有不同选项集的变量 - 而不是这个，为什么不创建一个具有多个属性的对象呢？

var config = {
    basic: {...},
    advanced: {...}
};

通过这种方式，您可以访问相应的配置：

$('textarea[tinymce]').each(function() {
   var tinymceopts = $(this).attr('tinymce');
   $(this).tinymce(config[tinymceopts]);
});

希望它有所帮助！

Answer 3

是否可以将选项放在标记中的数据集属性（docs）中？然后，您可以使用jQuery data()（docs）方法直接检索选项，而无需使用辅助变量。

您可以在属性中放置一个JSON字符串，jQuery会自动将其解析为可用对象。

<textarea class="tinymce" data-tinymceoptions='{"option":"option_value"}'></textarea>

$('textarea.tinymce').each(function(){
    var options = $(this).data('tinymceoptions');
    // pass the options on to the tiny MCE library
});

在jsFiddle上试试：http://jsfiddle.net/gF5Uq/

<强>文档

jQuery.data - http://api.jquery.com/data/
MDN上的HTML5元素数据集 - https://developer.mozilla.org/en-US/docs/DOM/element.dataset

jQuery - 基于Attribute的选择器

3 个答案: