Javascript 在jquery中单击文本区域上的切换按钮

我想在单击

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插件进行编辑。
使用以下方法：


$（文档）.ready（函数（）{
$（“textarea”）.focus（函数（）{
$（“按钮”）.show（）；
});
});



邮递
使用以下方法：


$（文档）.ready（函数（）{
$（“textarea”）.focus（函数（）{
$（“按钮”）.show（）；
});
});



邮递
要在初始化为tinymce的
上使用
blur
和
focus
事件，您需要在初始化时传递事件：

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>

#flow_info {
  display: none;
}

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();
    });
  }
});

JS:

<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>

#flow_info {
  display: none;
}

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();
    });
  }
});

工作
 要在初始化为tinymce的
上使用
blur
和
focus
事件，您需要在初始化时传递事件：

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>

#flow_info {
  display: none;
}

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();
    });
  }
});

JS:

<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>

#flow_info {
  display: none;
}

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();
    });
  }
});

工作


邮递


邮递
试试这个

$("#flow_button_view").focus(function() {
   $('#flow_info').show();
}

如果您想在用户在文本框外单击时显示按钮，则应使用另一个功能检查文本框中是否写入了内容，并使用聚焦功能“onkeypress”事件帮助您跟踪用户是否写入了内容。
尝试此操作

$("#flow_button_view").focus(function() {
   $('#flow_info').show();
}

如果即使用户在文本框外单击，也要显示按钮，则应使用另一个功能检查文本框中是否写入了内容，并使用聚焦功能“onkeypress”事件帮助您跟踪用户是否写入了内容。
我不确定，但我想您要问的是如何在文本框上启用/显示按钮单击/更改tinyMCE编辑器实例。
如果这是正确的，那么您可以使用TinyMCE的处理程序来检测状态更改和其他事件。您尚未指定使用哪个版本的TinyMCE，但对于4.x，您可以使用以下内容：

tinymce.init({
    setup: function (editor) {
        editor.on('focus', function (e) {  
          alert('Editor is in focus');
          $(".editor_submit_button").show();  // add an id to the button you want to toggle and use it here.          
         });
});

参考：

编辑：更新链接
我不确定，但我认为您要问的是如何在单击/更改tinyMCE编辑器实例时启用/显示按钮。
如果这是正确的，那么您可以使用TinyMCE的处理程序来检测状态更改和其他事件。您尚未指定使用哪个版本的TinyMCE，但对于4.x，您可以使用以下内容：

tinymce.init({
    setup: function (editor) {
        editor.on('focus', function (e) {  
          alert('Editor is in focus');
          $(".editor_submit_button").show();  // add an id to the button you want to toggle and use it here.          
         });
});

参考：

编辑：更新链接
您想在每次单击或键入文本区域时单击“发布”按钮吗？为什么看不到该按钮？div flow_info是否设置为显示：无？是否希望每次单击或键入文本区域时都单击“发布”按钮？为什么看不到该按钮？div flow_info是否设置为显示：none？或者使用
按键
事件代替
焦点
。这只会显示更改上的按钮很好，但当我在文本区域外单击时，按钮会再次隐藏，非常感谢您。如果您想在我们单击文本区域外时隐藏按钮，请使用：
$（“文本区域”）.blur（function（）{$（“button”）.hide（）；}您必须使用TinyMCE的事件hadler来处理它，该事件hadler是在初始化它时指定的。发布了一个关于如何做到这一点的答案。是的，没错。。使用此处解释的TinyMCE模糊事件：或使用
按键
事件代替
聚焦
。这只会显示更改上的按钮很好，但当我在文本区域外单击时，按钮会再次隐藏，非常感谢您。如果您想在我们单击文本区域外时隐藏按钮，请使用：
$（“文本区域”）.blur（function（）{$（“button”）.hide（）；}您必须使用TinyMCE的事件hadler来处理它，该事件hadler是在初始化它时指定的。发布了一个关于如何做到这一点的答案。是的，没错。。使用TinyMCE模糊事件，如下所述：Care to explain please.OP using TinyMCE.Care to explain please.OP using TinyMCE.先生，当我单击post按钮时出现问题，它不工作或隐藏thanksIt是完全不同的功能，与提供的问题内容无关。先生，当我单击“发布”按钮时出现问题，它不工作或隐藏。这是完全不同的功能，与提供的问题内容无关。