我们可以操纵已淡出的元素吗？

Question

我有一些按钮默认淡出，只有当用户点击页面内容时才会显示。 这工作得很好。 我现在需要在用户点击使其可见的内容之前将某些数据属性分配给这些按钮之一。

可以指向褪色的元素并添加所需的数据属性？

我所有的尝试都不成功。

任何帮助，这将不胜感激。

编辑：

<div class="ui-draggable"> 
    <div id="119a7" class="container template-block drg-elem"> 
     <div class="row clearfix drg ui-sortable" contenteditable="true"> 
      <div class="column col-md-6"> 
       <h1>Lorem Ipsum</h1> 
       <p>Lorem Ipsum is simply dummy text. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p> 
       <div class="row-arrange ui-sortable-handle"> 
        <div class="btn-xs arrange-handle"> 
         <i class="fa fa-arrows"></i> 
        </div> 
       </div> 
      </div> 
      <div class="column col-md-6"> 
       <img src="assets/builder/images/e09-1.jpg"> 
       <div class="row-arrange ui-sortable-handle"> 
        <div class="btn-xs arrange-handle"> 
         <i class="fa fa-arrows"></i> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
    <div class="tool-box"> 
     <div class="row-settings"> 
      <i class="fa fa-wrench"></i> 
     </div> 
    </div> 
</div> 

没有什么特别在这里。这是一个放在html page上的模板。

tool-box是被淡化的元素。

我试图引用这个元素，但它找不到。 问题是我怎样才能引用一个不可见的元素。

Answer 1

您是否在元素淡出之后删除元素？如果不是，您可以，否则不能。

$.extend($.fn, { 
 
    fill: function() { 
 
     return this.data('foo', 'bar'); 
 
    }, 
 
    inspect: function() { 
 
     console.log(this.data('foo')); 
 
     return this; 
 
    } 
 
}); 
 
$('button').click(function() { 
 
    $('main div')[this.id](); 
 
});

main div { 
 
    width: 100px; 
 
    height: 100px; 
 
    background: #333; 
 
    margin: 0 auto; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="fadeOut">Fade Out</button> 
 
<button id="remove">Remove</button> 
 
<button id="fill">Fill Data</button> 
 
<button id="inspect">Inspect</button> 
 
<main><div></div></main>