我的代码给了我一个错误,当我从我的输入删除data-other-placeholder
属性:文本像你见下文:如何控制元素不会出错?
"message": "Uncaught TypeError: Cannot read property 'length' of undefined",
我有,如果jQuery插件后声明中,你可以,如果你看一下看到一个控制..
(function($) {
"use strict";
$.fn.placeholderTypewriter = function(options) {
// Plugin Settings
var settings = $.extend({
delay: 50,
pause: 1000,
text: [],
loop: true
}, options);
// Type given string in placeholder
function typeString($target, index, cursorPosition, callback) {
// Get text
var text = settings.text[index];
// Get placeholder, type next character
var placeholder = $target.attr('placeholder');
$target.attr('placeholder', placeholder + text[cursorPosition]);
// Type next character
if (cursorPosition < text.length - 1) {
setTimeout(function() {
typeString($target, index, cursorPosition + 1, callback);
}, settings.delay);
return true;
}
// Callback if animation is finished
callback();
}
// Delete string in placeholder
function deleteString($target, callback) {
// Get placeholder
var placeholder = $target.attr('placeholder');
var length = placeholder.length;
// Delete last character
$target.attr('placeholder', placeholder.substr(0, length - 1));
// Delete next character
if (length > 1) {
setTimeout(function() {
deleteString($target, callback)
}, settings.delay);
return true;
}
// Callback if animation is finished
callback();
}
// Loop typing animation
function loopTyping($target, index) {
// Clear Placeholder
$target.attr('placeholder', '');
// Type string
typeString($target, index, 0, function() {
// Up index
index = index + 1;
// If loop is false, just run through the array once
if (index === settings.text.length && !settings.loop) {
return false;
}
// Pause before deleting string
setTimeout(function() {
// Delete string
deleteString($target, function() {
// Start loop over
loopTyping($target, index % settings.text.length)
})
}, settings.pause);
})
}
// Run placeholderTypewriter on every given field
return this.each(function() {
loopTyping($(this), 0);
});
};
}(jQuery));
$(function() {
var placeTarget = $(".search-hotels"),
dataValue = placeTarget.attr("placeholder"),
getPlaceholder = placeTarget.data("other-placeholder");
if (getPlaceholder.length > 0 || getPlaceholder !== undefined) {
var splitData = getPlaceholder.split("|"),
targetText = [dataValue];
var placeholderText = splitData;
if ((dataValue == "") || (dataValue == undefined)) {
placeTarget.placeholderTypewriter({
text: placeholderText,
delay: 70,
loop: false,
});
} else {
placeTarget.placeholderTypewriter({
text: targetText,
delay: 70,
loop: false,
});
}
}
});
input {
padding: 12px;
border: 3px solid #ccc;
margin: 30px auto;
display: block;
width: 50%;
}
<input type="text" class="search-hotels" placeholder="Hi I am a default placeholder that you've seen" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
如果您删除的属性,然后试图通过'数据得到它()'返回'null'。试试这个:'if(getPlaceholder && getPlaceholder.length> 0)' – DontVoteMeDown
嗯,你应该首先检查'getPlaceholder'是否未定义,然后如果它的长度是0,则不是相反。编辑:是的,因为DontVoteMeDown表示它会工作。 – nonzaprej
@nonzaprej这就是重点! – DontVoteMeDown