Question

我正在尝试开发一个在线差异工具。目前它显示了两个文件之间的差异。我还需要先前的差异和下一个差异功能。根据文档，它有命令“goNextDiff”和“goPrevDiff”。我已粘贴相关代码。 panel1和panel2由ajax调用填充。我正在获取内容和差异显示在面板中。我只想要一个差异，当他点击下一个差异按钮时，它应该转到下一个差异。我有两个按钮试图执行这些命令。我不确定它的语法。

    </div>
    <!-- JS code for the second panel -->
    <div id="panel1" style="display:none">

    </div>
    <!-- the placehorder for the merge/kdiff interface -->
    <div id="placeholder"></div>
  </body>
    <button id = "prevdiff" disabled onclick> Previous Difference </button>
    <button id = "nextdiff" disabled> Next Difference </button>
     <script type="text/javascript">
    dv = CodeMirror.MergeView(document.getElementById("placeholder"), {
    value: a1[0],
    orig:  a2[0],
    lineNumbers: true,
    mode: "javascript",

    highlightDifferences: true
    });

    var prev = document.getElementById("prevdiff");
    var next = document.getElementById("nextdiff");
    prev.disabled = false;
    next.disabled = false;
    prev.onclick = function(){ console.log("prevdiff"); this.execCommand("goPrevDiff"); console.log("prevdiff1");};
    next.onclick = function(){ console.log("nextdiff"); this.goNextDiff; console.log("nextdiff1");};




    });
 </script>

Answer 1

您应该能够使用CodeMirror对象（link）上的execCommand方法执行 goNextDiff 和 goPrevDiff 命令。在您的情况下，CodeMirror实例是由变量 dv 引用的MerveView对象的 edit 成员，因此您必须调用：

dv.edit.execCommand("goNextDiff");
dv.edit.execCommand("goPrevDiff");

当然这只会改变编辑器中的光标位置。我没有找到突出特定块的方法，这就是为什么在我自己的项目中（https://easydiff.com）我使用了2个独立的CodeMirror实例和托管差异计算，并用我自己的代码阻止突出显示

面对使用Codemirror的问题。正确的语法来执行merge.js中的命令

1 个答案: