jquery с зависанием только триггер один раз проблема - PullRequest
0 голосов
/ 28 марта 2020

Я хочу использовать указатель мыши для показа или скрытия кнопки управления (при наведении мыши на кнопку, показывать кнопку, при наведении мыши на кнопку, скрыть кнопку), но она выполняется только один раз, если я перемещаю курсор мыши на кнопку. во второй раз больше не будет отображаться. Ниже приведен код jsfiddle

<code><div class="cell code_cell rendered selected" tabindex="2"><div class="input"><div class="prompt_container"><div class="prompt input_prompt"><bdi>In</bdi>&nbsp;[1]:</div><div class="run_this_cell" title="Run this cell"><i class="fa-step-forward fa"></i></div></div><div class="inner_cell"><div class="ctb_hideshow"><div class="celltoolbar"></div></div><div class="input_area" aria-label="Edit code here"><div class="CodeMirror cm-s-ipython"><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 5.59375px; left: 5.59375px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" tabindex="0" style="position: absolute; bottom: -1em; padding: 0px; width: 1000px; height: 1em; outline: none;"></textarea></div><div class="CodeMirror-vscrollbar" cm-not-content="true"><div style="min-width: 1px; height: 0px;"></div></div><div class="CodeMirror-hscrollbar" cm-not-content="true"><div style="height: 100%; min-height: 1px; width: 0px;"></div></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true"></div><div class="CodeMirror-gutter-filler" cm-not-content="true"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 0px; min-width: 99.5938px; margin-bottom: -17px; border-right-width: 13px; min-height: 28px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines" role="presentation"><div role="presentation" style="position: relative; outline: none;"><div class="CodeMirror-measure"></div><div class="CodeMirror-measure"></div><div style="position: relative; z-index: 1;"></div><div class="CodeMirror-cursors"><div class="CodeMirror-cursor" style="left: 5.59375px; top: 0px; height: 16.6667px;">&nbsp;</div></div><div class="CodeMirror-code" role="presentation"><pre class=" CodeMirror-line " role="presentation"><span role="presentation" style="padding-right: 0.1px;"><span class="cm-builtin">print</span>(<span class="cm-string">"zzzz"</span>)</span>
点击 展开 输出; 双击 隐藏
zzzz
</code>

. , .

$(".code_cell").each(function(i,e){if ($(e).children("input[name='submit_add']").length == 0){$( '<input id="sa'+i.toString()+'" style="margin:2px;padding:2px;position:absolute;right:0;top:0;z-index:1000;" type="button" name="submit_add" value="+" />').insertBefore($(e).children()[0])}})


$("#sa0").hover(function(){$("#sa0").css("visibility",'');console.log("show");},function(){$("#sa0").css("visibility",'hidden');console.log("hide")});

ЗДЕСЬ - полный демонстрационный код онлайн jsfiddle

1 Ответ

1 голос
/ 28 марта 2020

Вместо использования .css() просмотрите toggle()

Рабочий фрагмент:

$("#sa0").hover(function() {
  $(this).toggle('slow');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="sa0">Hover me!</div>

Рабочая скрипка с вашим кодом: https://jsfiddle.net/1nhq8pd6/1/

...