javascript - 文本区域上的切换按钮单击 jquery

Question

我想在点击textarea时切换提交按钮的可见性。

HTML:

<textarea id="flow_button_view" name="dessc" class="social_text_area" placeholder="Flow your thinking"></textarea>
<div id="flow_info">
  <button name="Submit" type="submit" class="social_button_area" title=" Share Your Flow ">
    <i class="fa fa-share-alt-square"></i> Post
  </button>                 
</div>

当用户单击textarea时，我想查看该按钮。我的 textarea 使用 tineymce 插件进行编辑。

Answer 1

使用blur和focus您的<textarea>上的事件初始化为tinymce，初始化时需要传递事件:

HTML:

<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.5.3/tinymce.min.js"></script> 
.....
<textarea id="flow_button_view" name="dessc" class="social_text_area" placeholder="Flow your thinking"></textarea>

<div id="flow_info">
  <button name="Submit" type="submit" class="social_button_area" title=" Share Your Flow ">
    <i class="fa fa-share-alt-square"></i> Post
  </button>
</div>

CSS:

#flow_info {
  display: none;
}

JS:

var $info = $("#flow_info");

tinymce.init({
  selector: 'textarea',
  init_instance_callback: function (editor) {
    editor.on('focus', function (e) {
      $info.show();
    });
    editor.on('blur', function (e) {
      $info.hide();
    });
  }
});

正在工作JSFiddle 。