TA貢獻1829條經驗 獲得超4個贊
你可以這樣做：
這會在我們更改文本之前保存 hoved 元素的原始文本，當您離開/懸停時，我們會再次插入原始文本。
var original ="";
$('.new-text').hover(
function() {
original = $(this).text();
$(this).text($(this).attr("title"));
}, function() {
$(this).text(original);
}
);
演示
var original ="";
$('.new-text').hover(
function() {
original = $('.changing-text').text();
$('.changing-text').text($(this).attr("title"));
}, function() {
$('.changing-text').text(original);
}
);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='changing-text'>Original text</div>
<div class='new-text' title='New text 1'>Div 1</div>
<div class='new-text' title='New text 2'>Div 2</div>
TA貢獻1817條經驗 獲得超14個贊
你好，這是我的代碼簡單修復
$(".new-text").mouseenter(function() {
var title = $(this).attr('title');
var orignal = $('.changing-text').text();
$(this).attr('data-orignal',orignal);
$('.changing-text').text(title);
}).mouseleave(function() {
var orgnl = $(this).attr('data-orignal');
$('.changing-text').text(orgnl);
});
.container div {
display: inline-flex;
}
.new-text {
display: block;
margin: 15px;
cursor: pointer;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='changing-text'>Original text</div>
<div class="container">
<div class='new-text' title='New text 1'>Div 1</div>
<div class='new-text' title='New text 2'>Div 2</div>
</div>
TA貢獻1860條經驗 獲得超8個贊
如果我沒猜錯，那就試試這個吧。
是的，您認為正確，只有css您必須使用jQuery它是不可能的。試試這個解決方案。
jQuery(document).ready(function(){
var changing_text = jQuery('.changing-text').text();
jQuery('.new-text').hover(function(){
var title_value = jQuery(this).attr("title");
jQuery('.changing-text').text(title_value);
}, function(){
jQuery('.changing-text').text(changing_text);
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='changing-text'>Original text</div>
<div class='new-text' title='New text 1'>Div 1</div>
<div class='new-text' title='New text 2'>Div 2</div>
TA貢獻1802條經驗 獲得超4個贊
先自己嘗試一次，然后再在這里提出問題，或者如果您這樣做了，請展示您的嘗試
使用 CSS?:hover 選擇器
.new-text:hover {}
使用原生 JS鼠標懸停事件
<div onmouseover="()=>{}"></div>
使用 jQuery懸停事件
$(".new-text").hover(()=>{})
舉報