遗漏的类型错误:无法读取的不确定(...)财产“分割”
我得到遗漏的类型错误:无法读取属性未定义的“分裂”(...)遗漏的类型错误:无法读取的不确定(...)财产“分割”
这里是我的jQuery代码:
(function($) {
"use strict";
$('.tk-input').on('change', function(e){
var $umargin = $(this).parent();
var temp = '';
$umargin.find('.tk-input').each(function(input_index, input){
var margin_property = $(input).attr('data-property');
var input_value = $(input).val();
if(input_value != '')
{
if(input_value.match(/^[0-9]+$/))
input_value += 'px';
temp += 'margin-'+margin_property+':'+input_value+';';
}
});
$umargin.find('.tk-margin-value').val(temp);
});
$('.tk-margin-values').each(function(index, element){
var $umargin = $(this);
var tk_margin_value = $umargin.find('.tk-margin-value').val();
console.log($umargin.find('.tk-margin-value').val());
if(tk_margin_value != '')
{
var vals = tk_margin_value.split(';');
$.each(vals, function(i,vl){
if(vl != '')
{
var splitval = vl.split(':');
var margin_value = splitval[1];
var param = splitval[0].split('-');
var margin_property = param[1];
$umargin.find('.tk-input').each(function(input_index, input){
var input_margin_property = $(input).attr('data-property');
if(margin_property == input_margin_property)
$(input).val(margin_value);
});
}
})
}
});
})(jQuery);
这是我的HTML代码
<div class="tk-margin-values">
<input name="tk_margin_top" data-property="top" class="value-margin-top tk-input '. esc_attr($settings['param_name']) .' '. esc_attr($settings['type']) .'_field" type="text" value="' . esc_attr($top_val) . '">
<input name="tk_margin_right" data-property="right" class="tk-value-margin-right tk-input '. esc_attr($settings['param_name']) .' '. esc_attr($settings['type']) .'_field" type="text" value="' . esc_attr($right_val). '">
<input name="tk_margin_bottom" data-property="bottom" class="tk-value-margin-bottom tk-input '. esc_attr($settings['param_name']) .' '. esc_attr($settings['type']).'_field" type="text" value="'. esc_attr($bottom_val).'">
<input name="tk_margin_left" data-property="left" class="tk-value-margin-left tk-input '. esc_attr($settings['param_name']) .' '. esc_attr($settings['type']).'_field" type="text" value="' . esc_attr($left_val). '">';
//$pieces = array($margin_property, $top_val, $right_val, $bottom_val, $left_val);
//$values = implode('||', $pieces);
<input type="text" name="'. esc_attr($settings['param_name']) .'" class="tk-margin-value wpb_vc_param_value wpb-input '. esc_attr($settings['param_name']).' '. esc_attr($settings['type']) .'_field" value="'. esc_attr($value) .'" '. $dependency .' />';
</div>
$值在数据库中保存的价值,目前'margin-top:10px;margin-right:10px;'
保存在$值变量。
我不明白为什么$ umargin.find('。tk-margin-value').val()是为什么在控制台日志中未定义,为什么会出现此错误“Uncaught TypeError:无法读取属性'split'未定义的(......)”
更新
它现在的工作
,或者你可以检查if ($('.tk-margin-values').length))
长像下面
$(document).ready(function(){
"use strict";
$('.tk-input').on('change', function(e){
var $umargin = $(this).parent();
var temp = '';
$umargin.find('.tk-input').each(function(input_index, input){
var margin_property = $(input).attr('data-property');
var input_value = $(input).val();
if(input_value != '')
{
if(input_value.match(/^[0-9]+$/))
input_value += 'px';
temp += 'margin-'+margin_property+':'+input_value+';';
}
});
$umargin.find('.tk-margin-value').val(temp);
});
if ($('.tk-margin-values').length) {
$('.tk-margin-values').each(function(index, element){
var $umargin = $(this);
var tk_margin_value = $umargin.find('.tk-margin-value').val();
console.log($umargin.find('.tk-margin-value').val());
if(tk_margin_value != '')
{
var vals = tk_margin_value.split(';');
$.each(vals, function(i,vl){
if(vl != '')
{
var splitval = vl.split(':');
var margin_value = splitval[1];
var param = splitval[0].split('-');
var margin_property = param[1];
$umargin.find('.tk-input').each(function(input_index, input){
var input_margin_property = $(input).attr('data-property');
if(margin_property == input_margin_property)
$(input).val(margin_value);
});
}
})
}
});
}
});
工作小提琴fiddle link
错误$ html没有被删除,所有的html块都被打印出来。 $ html不是问题。我得到了同样的错误,如果($('。tk-margin-values')。length) –
检查这个小提琴。它的工作现在https://jsfiddle.net/gnanavelr/70vwp8Lp/ – vel
调试事件处理程序'$ this'后,我发现'$ this'在html文件中获取另一个'.tk-margin-class'。我将班级名称改为现在的班级名称。 –
有可能$(this)的值误导你。你有没有在你的事件处理程序中检查$(this)的值?它可能不是你认为这是因为事件冒泡的因素。它是否会返回您期望的值? – Hendeca
@Hendeca console.log($(this))// result> [div.tk-margin-values context:div.tk-margin-values selector:“”] [div.tk-margin-values context:div。 tk-margin-values选择器:“”] –
@亨德卡是的,你是对的我找到了2个块。我还有一个类.tk-margin-value,只是重命名。 –