#javascript #html #jquery #filter #codemirror
Вопрос:
я пытаюсь отфильтровать пользовательский список слов в режиме подсказки/автозаполнения, но с некоторыми проблемами. Я добавил css:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/codemirror.min.css"
integrity="sha512-xIf9AdJauwKIVtrVRZ0i4nHP61Ogx9fSRAkCLecmE2dL/U8ioWpDvFCAy4dcfecN72HHB9 7FfQj3aiO68aaaw=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/addon/hint/show-hint.min.css"
integrity="sha512-OmcLQEy8iGiD7PSm85s06dnR7G7C9C0VqahIPAj/KHk5RpOCmnC6R2ob1oK4/uwYhWa9BF1GC6tzxsC8TIx7Jg=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/addon/lint/lint.min.css"
integrity="sha512-jP1 o6s94WQS9boYeDP3Azh8ihI5BxGgBZNjkABhx05MqH5WuDzfzSnoPxGxVzWi/gxxVHZHvWkdRM6SMy5B0Q=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
и js:
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-MrcW6ZMFYlzcLA8Nl NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP JcXn/tWtIaxVXM"
crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj 3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/codemirror.min.js"
integrity="sha512-6Q5cHfb86ZJ3qWx47Pw7P5CN1/pXcBMmz3G0bXLIQ67wOtRF7brCaK5QQLPz2CWLBqjWRNH /bV5MwwWxFGxww=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/addon/hint/show-hint.min.js"
integrity="sha512-kCn9g92k3GM90eTPGMNwvpCAtLmvyqbpvrdnhm0NMt6UEHYs DjRO4me8VcwInLWQ9azmamS1U1lbQV627/TBQ=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/addon/hint/xml-hint.min.js"
integrity="sha512-WuVO/0caKHKP D/qCGcesy0yK0jbRq7ymsKS v4S2yPLfC3UG2afbteLTFpsiJC7X8x0HJ/SOODyjH8gQws2bQ=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/addon/hint/html-hint.min.js"
integrity="sha512-oxBKDzXElkyh3mQC/bKA/se1Stg1Q6fm7jz7PPY2kL01jRHQ64IwjpZVsuZojcaj5g8eKSMY9UJamtB1QR7Dmw=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/addon/hint/sql-hint.min.js"
integrity="sha512-GOlUf6o3j/ElIrQixctiGMJ0oUdpOTCSYyg4N7bDGLhRW8KKo6OLpCJMKs F4t2XXa1EL9Expcq4lkGgu1g0 Q=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/addon/hint/javascript-hint.min.js"
integrity="sha512-HB0sEfERI4Pe2z7rbx7JVGS0SEEGbnAbV 9X0bs3Hs9R/nCYartwJQg16bK1P0jPsMzbiXjT kYNHYLCsHQ8HA=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/addon/edit/closetag.min.js"
integrity="sha512-ZUq/bxUHwC35d3oP1hC5lshiHFCnI3dDtDPtSp9 CQDy/YU0LQu2ujDd603LuWho0G4XH8MSvyLV47x2Zcd8Jw=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/mode/xml/xml.min.js"
integrity="sha512-XPih7uxiYsO igRn/NA2A56REKF3igCp5t0W1yYhddwHsk70rN1bbbMzYkxrvjQ6uk W3m qExHIJlFzE6m5eg=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/mode/javascript/javascript.min.js"
integrity="sha512-9mEZ3vO6zMj0ub2Wypnt8owrHeoJCH22MkzeJ9eD3hca8/Wlqo5pEopI6HloA0F53f/RkRkHs8TyZMxbwVmnFw=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/mode/css/css.min.js"
integrity="sha512-YeNG6eTv q p/vvx E5u05IBRurTlv0jfQuvitZMD oNe9TfrGw z4MHHxhPlE3X3csemC5YXlzDLMSZrgb34A=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.2/mode/htmlmixed/htmlmixed.min.js"
integrity="sha512-IC qg9ITjo2CLFOTQcO6fBbvisTeJmiT5D5FnXsCptqY8t7/UxWhOorn2X GHkoD1FNkyfnMJujt5PcB7qutyA=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
Затем я создал Codemirror в своей текстовой области:
var myModeSpec = {
name: "htmlmixed",
tags: {
style: [["type", /^text/(x-)?scss$/, "text/x-scss"],
[null, null, "css"]],
custom: [[null, null, "customMode"]]
}
}
var editor = CodeMirror.fromTextArea(document.getElementById('editor'), {
lineWrapping: true,
lineNumbers: true,
matchBrackets: true,
mode: myModeSpec,
theme: "ambiance",
autoCloseBrackets: true,
autoCloseTags: true,
foldGutter: true,
gutters: ["CodeMirror-lint-markers", "CodeMirror-linenumbers", "CodeMirror-foldgutter"],
matchBrackets: {
afterCursor: true,
maxScanLines: 10000,
maxScanLineLength: 100000
},
lint: true,
matchTags: {
bothTags: true
},
extraKeys: {
"Ctrl-Space": "autocomplete",
},
autohint: true
});
И я отменяю hint.html способ:
var myHints = ["{{Test}}","{{Simple}}","{{Example.getFunction()}}"];
var orig = CodeMirror.hint.html;
CodeMirror.hint.html = function (cm) {
var inner = orig(cm) || { from: cm.getCursor(), to: cm.getCursor(), list: [] };
$.each(myHints, function (i, x) {
inner.list.push(x);
});
return inner;
};
Это добавит мой список к подсказкам html, но он не сможет фильтровать мои добавленные слова.
Есть ли способ фильтровать даже через них?
И могу ли я добавить свой собственный список в hint.html и подсказка.javascript без необходимости переопределять оба метода?
Спасибо
Комментарии:
1. может ли это вам помочь?
2. Это не совсем так, но это навело меня на мысль еще раз отфильтровать после того, как html-список будет заполнен html-тегами. Мне все еще нужно выполнять одну и ту же функцию для каждого типа подсказок(html, javascript, css). Я хочу использовать