我的代碼給了我一個錯誤,當我從我的輸入刪除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