Question

忽略那里的文本框，文本框应该只在你双击文本时出现但由于某种原因它在小提琴中显示（它在我的主程序中工作正常所以我猜它是一个CSS问题。

基本上，我正在显示一些文字，如果文字在一个范围内如此：

<span class="output" title="lalalalalblas asdl sda lasdl asdb">lalalalalblas asdl...</span>

如果文字太长，它只会显示一些文字，然后鼠标悬停在它上面会显示标题中的全文。

在我的Javascript中，我按照这样切换：

var tip;
var orig;
var switched = 0;
$('.output').hover(
    function () {
        tip = $(this).attr('title');
        orig = $(this).text();

        if (tip != orig) {
            $(this).fadeOut(function () {
                $(this).text(tip).fadeIn();
                switched = 1;
            });
        }
    },
    function () {
        if (switched == 1) {
            $(this).fadeOut(function () {
                $(this).text(orig).fadeIn();
                switched = 0;
                orig = "";
            });
        }
    });
});

正如你所看到的，我的JS非常简单，但当你将鼠标从下面的文本移动到上面的文本上时，问题出现了（转到我的小提琴测试中）...这个变量取一个其他变量的值的原因。

如何让它工作，以便不接受其他变量的文本？

Answer 1

您的tip，orig和switched vars正在处理程序函数之间共享，从而在所有元素之间共享。您可以为每个元素创建变量，如下所示：

$('.output').each(function() {
    var tip;
    var orig;
    var switched = 0;

    $(this).hover(function () {
        tip = $(this).attr('title');
        orig = $(this).text();
        if (tip != orig) {
            $(this).fadeOut(function () {
                $(this).text(tip).fadeIn();
                switched = 1;
            });
        }
    }, function () {
        if (switched == 1) {
            $(this).fadeOut(function () {
                $(this).text(orig).fadeIn();
                switched = 0;
                orig = "";
            });
        }
    });
});

现在，每个输出元素都会有tip，orig和switched。

小提琴： http://jsfiddle.net/wr1k02ym/4/

Jquery / Javascript - 变量取另一个变量值

1 个答案: