0

我需要在 CMS 文本区域中使用字符串/简码来定义按钮......对于非技术用户来说很简单,例如:

[button text="点击这里" href="http://www.google.com"]

基于该字符串,我需要在前端使用 mootools(或一般的 javascript)动态创建一个按钮(jquery 在我们的环境中不可用)。到目前为止,我还无法解析以括号开头的代码,然后获取这些属性以在代码中使用。然后我需要销毁原始简码。如果有更好的方法,它不必完全按照我上面的方式进行设置......任何建议都值得赞赏。

谢谢!

4

1 回答 1

0

这是我想出的解决方案......这有点像黑客,但它有效。我正在使用的 CMS 是基于 Coldfusion 的,但该方法应该是可转移的......

另一个复杂性:在我们的例子中,我们需要可编辑按钮出现在与模板的可编辑区域分开的位置。基本上,我们在侧边栏中有一个不可编辑的按钮,我们希望它可以从主要内容区域轻松编辑。因此,如果用户定义了一个按钮,我们将用用户定义的按钮替换侧边栏按钮。所以我有一个额外的步骤,我使用 mootools 来抓取创建的按钮,替换页面侧边栏中的按钮,然后销毁原始按钮。

目标是让用户在 CMS 的文本区域中的某处输入短代码,例如:

[button id="override-button" title="XXX" href="YYY"][/button]

后端会将其转换为 DOM 元素,而在前端,我们将使用 mootools 将按钮定位在需要的位置,然后销毁原始标记。

首先,我在数据库输出中搜索了代码......

<cfset find1='\[button'>    <!-- open-->
<cfset find2='\]\[/button]'>    <!-- close -->

接下来,在coldfusion中使用正则表达式替换,我将按钮的第一个实例替换为标记...(rs.body是指从数据库返回的正文数据)...

<cfset replace1 = "<button">
<cfset replace2 = "></button>">
<cfset rs.body=#REReplace(rs.body,find1,replace1,"ONE")#>
<cfset rs.body=#REReplace(rs.body,find2,replace2,"ONE")#>

因此,生成的标记将是:

<button id="override-button" title="XXX" href="YYY"></button>

接下来,我使用 mootools 来操作该 DOM 元素。如前所述,侧边栏中已经有一个 ID 为“open-form-b​​utton”的按钮,因此它会抓取该按钮并将文本和链接替换为上面定义的属性,然后销毁上面定义的元素。

var overrideBtn = $('override-button');
var overrideBtn_title,overrideBtn_href = null;

if (overrideBtn) {
overrideBtn_title = overrideBtn.getProperty('title');
overrideBtn_href = overrideBtn.getProperty('href');

if (overrideBtn_title && overrideBtn_href)
{
    $('open-form-button').set('text', overrideBtn_title);
    $('open-form-button').setProperty('href',overrideBtn_href);
    overrideBtn.dispose();
}
}

就是这样。我不知道这对其他人有多大帮助,但由于朱利安建议我发布我的解决方案,我希望它可以帮助别人!祝你好运!

于 2012-10-31T14:40:48.567 回答