layui のチェックボックスは、lay-skin="switch" を使用してイベントの割り当てと値をフィルタリングします。

layui では、lay-skin="switch"使用されるチェックボックス コンポーネントは、フィルタリング操作を実行するときにイベントをトリガーしますform.on('switch(filter)')このイベントの処理関数では、dataパラメータを通じて関連データを取得できます。

具体的には、dataパラメータには次のプロパティが含まれます。

  1. elem: チェックボックスの元の DOM オブジェクトを取得します。
  2. value: チェックボックスの値を取得します。true の場合はチェックされた状態を意味し、false の場合はチェックされていない状態を意味します。

switch(filter) イベントをリッスンすることで、選択スイッチが変更されたときに対応するフィルタリング操作を実行できます。イベント コールバック関数では、data.elem を通じて元のチェックボックス DOM オブジェクトを取得し、data.value を通じてチェックボックスの値 (true または false) を取得できます。特定のニーズに応じて、イベント コールバック関数に独自のフィルタリング ロジックを作成できます。

HTML

コード

 <div class="layui-form-item">
                    <label for="rec_time" class="layui-form-label">短信通知<span class="x-red"></span></label>
                    <div class="layui-input-inline">
                        <input type="checkbox" name="sms" lay-skin="switch" lay-text="开启|关闭" lay-filter="sms">
                    </div>
                </div>

スイッチの割り当てと値

    //短信是否通知
        var sms;
        form.on("switch(sms)", function (data) {
    
    
            var thisValue = this.checked ? '1' : '0';
            //console.log(thisValue);
            if (thisValue == 1) {
    
    
                $("#pat").css("display", "block");
                sms = 1;
            } else {
    
    
                $("#pat").css("display", "none");
                sms = 0;
            }
        });

時々行方不明です

おすすめ

転載: blog.csdn.net/weixin_41290949/article/details/132787824