<input class="ewm" type="text" placeholder="请扫描料框条码" value="" /> 输入框输入时placeholder消失
时间: 2023-07-08 15:53:29 浏览: 51
您可以使用JavaScript来实现在输入时隐藏placeholder的效果。可以通过监听输入框的focus和blur事件来控制placeholder的显示和隐藏。具体实现方法如下:
HTML代码:
```
<input id="input-box" class="ewm" type="text" placeholder="请扫描料框条码" value="" />
```
JavaScript代码:
```
var inputBox = document.getElementById("input-box");
inputBox.addEventListener("focus", function() {
inputBox.removeAttribute("placeholder");
});
inputBox.addEventListener("blur", function() {
inputBox.setAttribute("placeholder", "请扫描料框条码");
});
```
当输入框获得焦点时,移除placeholder属性;当失去焦点时,重新添加placeholder属性。这样可以在输入时隐藏placeholder。
相关问题
<div class="ewm"> <img src="../assets/weixin.png"> <img src="../assets/weibo.png"> <img src="../assets/douyin.png"> <img src="../assets/shipin.png"> </div>让这几个图片之间有50px的间距怎么写css
可以使用 `margin` 属性来为图片之间添加间距。具体来说,可以为 `.ewm` 类添加如下的样式:
```css
.ewm img {
margin-right: 50px;
}
```
这样就可以为每个图片元素添加右侧 50px 的外边距,从而实现图片之间的间距效果。如果需要在最后一个图片元素后面去掉间距,可以使用 `:last-child` 伪类来去除最后一个图片元素的外边距:
```css
.ewm img:last-child {
margin-right: 0;
}
```
$(".ewm").ready(function(){ var inputBox = document.getElementById("input-box"); inputBox.addEventListener("focus", function() { inputBox.removeAttribute("placeholder"); }); inputBox.addEventListener("blur", function() { inputBox.setAttribute("placeholder", "请扫描料框条码"); }); 换成jquery })
可以将上述代码用 jQuery 重写如下:
```
$(document).ready(function() {
var inputBox = $("#input-box");
inputBox.focus(function() {
inputBox.removeAttr("placeholder");
});
inputBox.blur(function() {
inputBox.attr("placeholder", "请扫描料框条码");
});
});
```
这里使用了 `$(document).ready()` 方法来确保 DOM 加载完成后再执行 JavaScript 代码。然后使用 `$()` 函数来选取 `input-box` 元素,并将其绑定 `focus` 和 `blur` 事件的处理函数,从而实现与原代码相同的功能。