我正在使用jsdifflib(https://github.com/cemerick/jsdifflib#demo)在我的网页上进行文本比较。我正在尝试使用jquery-UI选项卡为每个比较结果获取单独的选项卡。这是工作。但是有一个大问题:
我对diff.js进行了以下代码更改,以将表输出成功获取到我的变量中:
来自diff.js的代码
function diffUsingJS(viewType) {
"use strict";
var byId = function (id) { return document.getElementById(id); },
base = difflib.stringAsLines(byId("baseText").value),
newtxt = difflib.stringAsLines(byId("newText").value),
sm = new difflib.SequenceMatcher(base, newtxt),
opcodes = sm.get_opcodes(),
diffoutputResult, //orig diffoutput new:textCmpTabs
//contextSize = byId("contextSize").value; //orig
contextSize = null;
diffoutputResult = diffview.buildView({
baseTextLines: base,
newTextLines: newtxt,
opcodes: opcodes,
baseTextName: "Base Text",
newTextName: "New Text",
contextSize: contextSize,
viewType: viewType
});
return diffoutputResult;
}
我的jscript代码:
...
// Dynamic Tabs using jquery UI
function textCmpTabsAddTab(t,c) {
var label = t,
id = 'textCmpTabs-'+label,
li = $( textCmpTabsTmpl.replace( /#\{href\}/g, "#" + id ).replace( /#\{label\}/g, label ) ),
tabContentHtml = c;
textCmpTabs.find(".textCmpTabs").append(li);
textCmpTabs.append( '<div id="' + id + '"><p>').append(tabContentHtml).append('</p></div>');
textCmpTabs.tabs( "refresh" );
}
...
...
$( "#sidebyside" ).click(function() {
var diffResult = diffUsingJS(0);
textCmpTabsAddTab(k,diffResult);
k += 1;
}
);
问题:=== 但是所有表(差异结果)都显示在所有选项卡中。 diffview.js中似乎有一些“ document.createElement”命令正在整个文档上创建对象。我不确定如何,为什么或是否还有其他东西?
有人可以解释如何仅在自己的标签中获得每个比赛的结果(默认标签为空)吗?
谢谢。