【问题标题】:Creating an inline 'Jargon' helper in PHP在 PHP 中创建一个内联的“行话”助手
【发布时间】:2011-09-26 19:57:52
【问题描述】:

我有一篇 HTML 格式的文章。它包含很多可能有些人不会理解的行话。

我还有一个术语表(MySQL 表),其中包含对那里的人有帮助的定义。

我想浏览我文章的 HTML 并找到这些词汇表术语的实例,并用一些不错的 JavaScript 替换它们,这将显示一个带有术语定义的“工具提示”。

我已经差不多完成了,但我仍然遇到一些问题:

  • 在单词中找到术语(即:APS 在 Maybe 中)
  • 我必须确保它不会对 alt、标题、链接文本等执行此操作。所以只有没有应用任何格式的文本。但它需要在表格和段落中发挥作用。

这是我的代码:

$query_glossary = "SELECT word FROM glossary_terms WHERE status = 1 ORDER BY LENGTH(word) DESC";
$result_glossary = mysql_query_run($query_glossary);

//reset mysql via seek so we don't have to do the query again
mysql_data_seek($result_glossary,0); 

while($glossary = mysql_fetch_array($result_glossary)) {

    //once done we can replace the words with a nice tip
    $glossary_word = $glossary['word'];
    $glossary_word = preg_quote($glossary_word,'/');        
    $article['content'] = preg_replace_callback('/[\s]('.$glossary_word.')[\s](.*?>)/i','article_checkOpenTag',$article['content'],10);     
}

这里是 PHP 函数:

function article_checkOpenTag($matches) {
  if (strpos($matches[0], '<') === false) {
    return $matches[0];
  } 
    else {
        $query_term = "SELECT word,glossary_term_id,info FROM glossary_terms WHERE word = '".escape($matches[1])."'";
        $result_term = mysql_query_run($query_term);
        $term = mysql_fetch_array($result_term);

        # CREATING A RELEVENT LINK
        $glossary_id = $term['glossary_term_id'];
        $glossary_link = SITEURL.'/glossary/term/'.string_to_url($term['word']).'-'.$term['glossary_term_id'];

        # SOME DESCRIPTION STUFF FOR THE TOOLTIP
        if(strlen($term['info'])>400) {
            $glossary_info = substr(strip_tags($term['info']),0,350).' ...<br /> <a href="'.$glossary_link.'">Read More</a>';
        }
        else {
            $glossary_info = $term['info'];
        }


        return ' <a href="javascript:;" onmouseout="UnTip();" class="article_jargon_highligher" onmouseover="'.tooltip_javascript('<a href="'.$glossary_link.'">'.$term['word'].'</a>',$glossary_info,400,1,0,1).'">'.$matches[1].'</a> '.$matches[2];
  }
}

【问题讨论】:

  • 您是否尝试过用单词边界转义序列将正则表达式中的词汇表单词包围起来:\b
  • @SimpleCoder 介意举个例子吗?我对正则表达式不是很好
  • 使用带有javascript: 伪 URL 的链接是一种不好的做法,它违反了 优雅降级 的原则(即您的网站应该在关闭 javascript 的情况下正常工作)。此外,不需要这种复杂性。要添加工具提示,只需将其放在 TITLE 属性中:例如&lt;span title="This is a tooltip!"&gt;Jargon term&lt;/span&gt;。所有现代浏览器(包括 IE6)都会在鼠标悬停时创建一个显示此文本的弹出窗口。亲吻
  • 正如 DA 指出的那样,这个问题与 Search and Replace Words in HTML 重复。多次问这个问题没有帮助。

标签: php javascript mysql html regex


【解决方案1】:

有趣的是,我完全不是在寻找像你这样的问题,但在阅读时我意识到你的问题是我很久以前经历过的一个

它基本上是一个解析字典并吐出增强 HTML 的系统。

我的建议包括:

  1. 根据需要使用数据库,但缓存生成的 CSV 文件用作字典可能更快
  2. 在渲染系统中使用挂钩来解析此字典中的实际内容
  3. 页面缓存也很有用

I elaborated a solution on my blog(法语,抱歉)。但它基本上概述了您可以实际使用的东西。

我称它为“ContentAbbrGenerator”作为 MODx 插件。但是插件的原始内容可以应用到已建立的结构之外。

无论如何,您都可以下载 zip 文件并获取 RegExes 并找到解决方法。

我的目标

  1. 使用一个被读取的文件来获得一种 html 装饰。
  2. 从作者输入的不了解可访问性和标签(dfn 和/或缩写)的内容中生成 html
  3. 使其可重复使用。
  4. 使其可i18n 化。也就是说,在法语中,我们使用英语定义,但自适应技术以法语读取英语单词并且听起来很奇怪。所以我们不得不使用 lang="" 属性来说明清楚。

我做了什么

基本上是您给出的文本更具语义化。

想象一下下面的字典:

en;abbr;HTML;Hyper Text Markup Language;es
en;abbr;abbr;Abbreviation

那么,CMS 输入的内容会吐出这样的文字:

<p>Have you ever wanted to do not hassle with HTML abbr tags but was too lazy to hand-code them all!? That is my solution :)</p>

翻译成:

    <p>Have you ever wanted to do not hassle with <abbr title="Hyper Text Markup Language" lang="es">HTML</abbr> <abbr title="Abbreviation">abbr</abbr> tags but was too lazy to hand-code them all!? That is my solution :)</p>

一切都取决于您可以从数据库生成的一个 CSV 文件。

我使用的约定

  1. 文件 /abbreviations.txt 在服务器上公开可用(可以生成)是一本字典,每个首字母缩略词一个定义
  2. 实现只需读取文件并在将其发送到客户端之前应用它

工具提示

我强烈建议您使用甚至 Twitter Bootstrap 实现的工具提示工具。它基本上可以读取您想要的任何标记标签的标题。

看看那里:Bootstrap from Twitter with Toolip helper

PS:我非常喜欢 Twitter 在这个 Bootstrap 项目中提出的模式,值得一看!!

【讨论】:

    【解决方案2】:

    将负载从服务器转移到客户端。假设您的“俚语词典”不经常更改,并且您想为大量文章中的单词“添加漂亮的工具提示”,您可以将其导出到 .js 文件中,并将相应的

    然后编写一个客户端 js 脚本,它会尝试找到一个放置“带有俚语的内容”的 dom 节点,然后从字典中解析出出现的单词并用一些 html 包装它们以显示工具提示。一切都用 js,一切都是客户端。

    如果该方法不合适,而您要在 php 后端完成这项工作,至少要考虑对已处理内容进行一些缓存。

    我还看到您为在内容中找到的每个“行话词”插入了描述文本。如果一个词在一篇文章中出现频率很高怎么办?你得到开销。将这些描述分开,将它们作为对象放入 JS 中。任务是找到有描述的单词,并使用一些短标签来标记它们,例如 。您的 js 脚本应该找到那个 em,从对象中选择一个描述(带有单词描述的关联数组)并在“鼠标悬停”事件上动态构建一个工具提示。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-08-04
      • 1970-01-01
      相关资源
      最近更新 更多