0

Uncaught TypeError: Cannot read property 'split' of undefined(…) が表示されます

ここに私の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>

$value はデータベースに保存された値で、現在'margin-top:10px;margin-right:10px;'$value 変数に保存されています。

なぜ $umargin.find('.tk-margin-value').val() がコンソール ログで undefined なのか、なぜこのエラーが発生するのか理解できません "Uncaught TypeError: Cannot read property 'split' of undefined(…) "

4

1 に答える 1

1

更新しました

その作業は今

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);
                            });
                        }
                    })
                }
            });
        }
        } );

ワーキングフィドルフィドルリンク

于 2016-12-03T05:39:15.023 に答える