XML ファイルに基づくオートコンプリートを使用して検索を作成しています。ユーザーが単語を入力すると、テキストがハイライトされます。
私がこれまでに行ったこと：
$(function() {
function log( message ) {
$( "<div/>" ).text( message ).prependTo( "#log" );
$( "#log" ).scrollTop( 0 );
}
$.ajax({
url: "ecole.xml",
dataType: "xml",
success: function( xmlResponse ) {
var data = $( "school", xmlResponse ).map(function() {
return {
value: $( "name", this ).text() + ", " +
( $.trim( $( "adress", this ).text() ) + ", " + $( "description", this ).text() || "(unknown article)" ),
id: $( "id", this ).text(),
text: $( "description", this ).text()
};
}).get();
$( "#birds" ).autocomplete({
source: data,
minLength: 0,
select: function( event, ui ) {
log( ui.item ?
"Selected: " + ui.item.value + ", Id: " + ui.item.id + ", Text: " + ui.item.text :
"Nothing selected, input was " + this.value );
},
});
}
});
});
テキストを強調表示する方法がよくわかりません。私はこのコードを使用します:
$(function() {
highlight: function(match, keywords) {
keywords = keywords.split(' ').join('|');
return match.replace(new RegExp("("+keywords+")", "gi"),'<b>$1</b>');
}
});
しかし、私は今なぜそれがうまくいかないのか本当にわかりません
ここに私の HTML / PHP があります:
<div id="RecentEdition">
<?php
$schools = simplexml_load_file('ecoles.xml');
foreach ($schools->RecentEdition as $RecentEdition):
foreach ($RecentEdition->school as $school): ?>
<figure>
<img src='<?php echo "{$school->image} \n"; ?>' title='' />
<figcaption>
<h3>Contents</h3>
<p class="over">
<ul>
<?php foreach ($school->content as $content): ?>
<?php foreach ($content->chap as $chap): ?>
<li><a href="<?php echo "{$chap['link']} \n"; ?>"><?php echo "{$chap} \n"; ?></a></li>
<?php endforeach; ?>
<?php endforeach; ?>
</ul>
</p>
<p class="go">
<a href="<?php echo "{$school->link} \n"; ?>">View »</a>
</p>
</figcaption>
</figure>
<?php endforeach; ?>
<?php endforeach; ?>
</div>
そして、ここに私のXMLがあります:
<?xml version="1.0" encoding="utf-8"?>
<schools>
<RecentEdition>
<school>
<name>École1</name>
<id>1</id>
<link>./Marlburian0809/index.html</link>
<image>./img/zine.jpg</image>
<content>
<chap link="./Marlburian0708/#/2/">The Master's Speech</chap>
<chap link="./Marlburian0809/#/8/">College Community</chap>
<chap link="./Marlburian0809/#/50/">Trips n Expeditions</chap>
<chap link="./Marlburian0809/#/64/">Creative Arts</chap>
<chap link="./Marlburian0809/#/92/">Sports</chap>
</content>
<description>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer luctus porta turpis, id congue nisi dapibus nec. Maecenas pulvinar blandit turpis, sit amet viverra arcu convallis id. Donec varius blandit orci nec molestie. Cras auctor, metus eget volutpat hendrerit, massa nibh tempor nunc, volutpat ultrices nibh eros vestibulum nulla. Aenean libero risus, auctor sed blandit ut, tincidunt non est. Nullam bibendum nunc non tortor eleifend consectetur. Proin porttitor, diam ac varius semper, leo odio mattis erat, id luctus ligula libero eu mi. Proin et lacus ligula. Quisque non consequat mauris. Morbi dolor mi, dapibus a condimentum ac, luctus at elit. Praesent sit amet felis at magna sagittis pharetra et vitae neque.
</description>
</school>
</RecentEdition>
</schools>
そして別の質問です。オートコンプリートに大きなテキストがある場合:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis vulputate nibh urna. Aliquam in arcu vel diam malesuada malesuada. Ut volutpat hendrerit sollicitudin. Quisque 前庭 adipiscing rhoncus。Curabitur laoreet interdum tempus. Aliquam sit amet urna quis dui rhoncus venenatis iaculis id arcu. Proin sit amet tincidunt est. Aenean ut tellus lectus. Vestibulum ac enim orci.
世界 « Interdum tempus » と書くと、結果が表示されます: « …laoreet interdum tempus. Aliquam 座って… »
出来ますか ？
助けてくれてどうもありがとう。