javascript - 幻灯片 jq 中未显示输入的 PlaceHolder

Question

我有一个按钮：

<a  data-role="button" data-transition="none"
data-theme="b" onclick="ShowInput();" data-icon="forward" data-iconpos="left">
</a>

通过点击按钮，输入向下滑动：

function ShowInput() {
    $('#IdIn').slideDown("slow");
}

我的输入：

<input placeholder="xxx" name="NameIn" id="IdIn" value="" type="text">

向下滑动有效，但看不到输入的占位符“xxx”

为什么？

score 2 · Accepted Answer

这里的问题是，如果输入元素不足以容纳占位符，则占位符会消失。如果您稍后应该更改高度，它不会再次出现，这就是您使用slideDown().

我不确定这是否是特定于 chrome 的错误，或者是否是预期的行为。但是，如果在动画完成时通过删除样式属性来重绘元素，它似乎可以工作：http: //jsfiddle.net/QYp9Y/

$('#IdIn').slideDown("slow", function() {
    $(this).removeAttr('style').show();
});

score 0 · Accepted Answer

定义一个容器来保存输入元素，然后显示/隐藏容器而不是输入。

<div id="IdContainer">
<input placeholder="xxx" name="NameIn" id="IdIn" value="" type="text">
</div>

然后在javascript中，

function ShowInput() {
    $('#IdContainer').slideDown("slow");
}

2 回答 2