我正在使用用户名的输入字段构造一个表单。我想使用正则表达式将用户名限制在很小的字符范围内,根据用户输入时与正则表达式相比输入的有效性,将文本的颜色从红色更改为绿色。
到目前为止,尽管对正则表达式进行了积极的测试,它仍然没有选择出任何无效的字符。
https://regex101.com/r/XPFy6c/1/
/^[A-Z0-9 -]+$/igm
Run Code Online (Sandbox Code Playgroud)
这是代码,这里是JSFiddle 。
/^[A-Z0-9 -]+$/igm
Run Code Online (Sandbox Code Playgroud)
const form = document.querySelector('form');
const input = document.querySelector('input');
const check = /^[A-Z0-9 -]+$/ig;
form.addEventListener("input", e => {
const checkName = check.test(input.value);
if(!check) {
input.classList.add('invalid-name');
input.classList.remove('valid-name');
} else {
input.classList.add('valid-name');
input.classList.remove('invalid-name');
}
})Run Code Online (Sandbox Code Playgroud)
.invalid-name {
color: red;
}
.valid-name {
color: green;
}Run Code Online (Sandbox Code Playgroud)
更新:尽管此问题已解决,但是如果您尝试使用该代码,则会注意到正则表达式交替为真/假仍然存在问题。这个问题的解决方案在这里。
我正在尝试获取一个链接,单击该链接时会将图像加载到DIV中.这是我到目前为止所拥有的:
http://jsfiddle.net/AndyMP/kgvux/
JQuery的
$(function () {
$(".link").click(function (e) {
var url = $(this).data('href')
$('.enclosure').load(url)
return false;
});
});
Run Code Online (Sandbox Code Playgroud)
HTML
.enclosure {
width: 400px;
height: 200px;
border: 1px solid black;
overflow: hidden;
}
.link {
cursor: pointer;
}
Run Code Online (Sandbox Code Playgroud)
HTML
<div class="enclosure">
<img src="http://news.bbcimg.co.uk/media/images/67419000/jpg/_67419697_hull-getty.jpg">
</div>
<div class="link" data-href="http://news.bbcimg.co.uk/media/images/67424000/jpg/_67424686_67424685.jpg">Click me</div>
Run Code Online (Sandbox Code Playgroud) 关于SO的讨论很多,但我尝试了一些没有成功的建议.我有一个DIV,我需要一个图像,其高度和宽度是未知的,水平和垂直居中.
我也需要这么多次,所以我不想每次都要添加更多的CSS代码.
这就是我在DIV的CSS和HTML方面所拥有的.
.gallery_image_container {
position: relative;
width: 830px;
height: 500px;
z-index: 7;
border: solid 4px #EAEAEA;
background-image:url(bottom_back.png);
}
Run Code Online (Sandbox Code Playgroud)
和
<div class="gallery_image_container">
<img src="image.png" />
</div>
Run Code Online (Sandbox Code Playgroud) 由于在使整个DIV可点击的上下文中使用data-href ="",我得到一个验证错误.JS和HTML如下.我该怎么做才能使这个W3C兼容?
JQUERY
$(function(){
$(".linked").click(function(){
window.location = $(this).attr("data-href");
return false;
});
});
Run Code Online (Sandbox Code Playgroud)
HTML
<div class="" data-href="link.html"></div>
Run Code Online (Sandbox Code Playgroud) 代码输出"我将前往洛杉矶.行程将是300英里的距离.我们将需要停止2次." 什么时候它应该根据我的IF语句中定义的数字拉出"停止"这个单词的复数或单数(在这种情况下,它应该是复数).由于我构建类的方式,我猜测IF不能像我预期的那样工作.任何帮助修复它将不胜感激.
class trip {
public $destination;
public $distance;
public $unit;
public $stops = null;
public $transport = null;
function __construct($destination, $distance, $unit, $stops, $transport) {
$this->destination = $destination;
$this->distance = $distance;
$this->unit = $unit;
$this->stops = $stops;
$this->transport = $transport;
}
function getTrip() {
$a = "I will be going to " . $this->destination . ". ";
$a .= "The journey will be a distance of " . $this->distance . " " . $this->unit . ". ";
$a .= …Run Code Online (Sandbox Code Playgroud)