常連

jquery.validationEngine-ja.js で入力フォームのチェックをさせています。
今回、海外の方から「電話番号が入力できない」と問い合わせが来て、
コードをあらためて確認したところ、

```JavaScript
				"tel": {
					// credit: jquery.h5validate.js / orefalo
					"regex": /^0[0-9\-]{7,13}$/,
					"alertText": "電話番号が正しくありません"
				},
```
となっていました。

希望としては、
・国内の固定電話のチェック
 03-○○○○-○○○○
  045-○○○-○○○○
  0456-○○-○○○○
  04567-○-○○○○
  0120-○○○-○○○
・携帯電話のチェック
 090-○○○○-○○○○
に加えて、
・国際電話番号のチェック
 +81-3-○○○○-○○○○（+プラス記号の記入も許可する）
 81-3-○○○○-○○○○
も確認させたいのですが、どのように書き直したらよいのでしょうか？
-（ハイフン）はあってもなくても許可させたいです。

初めての質問で、わかりづらいところも多いと思いますが 
どなたか回答お願い致します。

国際電話番号を含めた電話番号の正規表現がわからない

### jquery-validateを使用してエラーメッセージを表示したい

該当箇所が空欄時にエラーメッセージを表示したいのですが、どうしても実行されません。
初歩的な質問で申し訳ありませんが、お力添えいただけますと助かります。
よろしくお願いいたします。



### 該当のソースコード

```JS
 <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="crossorigin="anonymous"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.5/jquery.validate.min.js"></script>
 <script src="js/script.js">

$('.form').validate({
 
  rules: {

      name: {
          required: true
      },
      mail: {
          required: true
      },
      tel: {
          required: true
      },
      text: {
          required: true
      }

  },

  messages: {

      name: {
          required: 'お名前を入力してください'
      },
      mail: {
          required: 'メールアドレスを入力してください'
      },
      tel: {
          required: '電話番号を入力してください'
      },
      text: {
          required: '詳細を入力してください'
      }


  }
});
    </script>
```
```HTML
<div class="form">

         <div class="form-Item Item">
             <p class="form-Item-Label">お名前</p>
             <input type="text" name="name" class="form-Item-Input" placeholder="お名前">
         </div>
        
         <div class="form-Item Item">
             <p class="form-Item-Label">メールアドレス</p>
             <input type="email" name="mail" class="form-Item-Input" placeholder="sample@abc.jp">
         </div>

         <div class="form-Item Item">
             <p class="form-Item-Label">電話番号</p>
             <input type="text" name="tel" class="form-Item-Input" placeholder="09012345678">
         </div>

         <div class="form-Item">
             <p class="form-Item-Label">お問い合わせ内容</p>
             <textarea class="form-Item-Textarea" name="text" placeholder="ご希望のキーワードなどございましたら、こちらにご記入ください。"></textarea>
         </div>
         
         
         <input type="submit" class="form-Btn" value="送信する">
        
</div>
```



jquery-validateが動作しない

STS4を使ってSpringの参考書を進めていましたがvalidationの章で

import javax.validation.constraints.AssertFalse;
import javax.validation.constraints.Email;
import javax.validation.constraints.Max;
import javax.validation.constraints.Min;
import javax.validation.constraints.NotBlank;
import javax.validation.constraints.NotNull;
import javax.validation.constraints.Pattern;

をインポートしようと入力したところ「インポートされた javax.validation は見つかりません」というエラーが出てが出てしまいました。

調べてみたところライブラリーのビルドパスが通っていないのが原因のようだったので、

jarファイルのビルドパスを通そうと思いましたがvalidationが入ったjarファイルがどれかわからず行き詰ってしまいました。

そこで質問なのですが、validationを使えるようにするにはどのjarファイルのビルドパスを通せばよいのでしょうか。

もしくは全く別の可能性が考えられるならご指摘お願いします。

インポートされた javax.validation は見つかりません

今post carouselというプラグイン→https://ja.wordpress.org/plugins/post-carousel/を使って
wordPressサイトを制作していますが、以下のエラーメッセージと共に反映されません。

<?php echo do_shortcode( '[post-carousel id="52"]' ); ?>のように囲ってもみましたが、
動きません。

原因がわかる方回答をお願いします。


エラーメッセージ
Uncaught TypeError: jQuery(...).slick is not a function
    at HTMLDocument.<anonymous> ((index):120)
    at i (jquery.js?ver=1.12.4-wp:2)
    at Object.fireWith [as resolveWith] (jquery.js?ver=1.12.4-wp:2)
    at Function.ready (jquery.js?ver=1.12.4-wp:2)
    at HTMLDocument.J (jquery.js?ver=1.12.4-wp:2)

Uncaught TypeError: jQuery(...).slick is not a functionと表示されてしまいます。

# 解決したいこと
jQueryを使ってフォームに入力された値を自動計算したい

## 現状
現在フリマアプリを作成してます。出品する際に金額を指定するのですが、入力した金額の手数料と販売利益を自動で計算して表示してくれる機能を実装したいのですが出来ません。

## 試したこと
jsファイルに以下を記述してみたが動作しなかった。

products_new.js
```

$(function(){
  $('#price-result').change(function(){
    var s = $(#price-result).val();
    var result = s / 10;
  
    $('.haihun_tax').append(result);
  });
});
```

## 記述コード
new.html.haml

```
　　　省略

        .new_page_price
          %span.label_title
            販売価格
          %span.required 必須
          .price__table
            %span ¥
            %span 
              = form.text_field :price, placeholder: "0", id: "price-result"

        .new_page_main__sales_commission
          %span.sales_commission 販売手数料（10%）
          %span.haihun_tax ー
        %hr
        .new_page_main__profit
          %span.profit 販売利益
          %span.haihun-profit ー        

        %but.exhibit
          = form.submit '出品する', class:"submit-exhibit"
        %button.save 下書きに保存
        .escape 
          = link_to root_path do
            戻る

　　省略
```

##参考
rails 5.2.3
MySql

jQueryを使ってフォームに入力された値を自動計算したい

下記のようなコードを書いておりjquery.validate.jsを使用してます。
エラー文言とともに入力した枠を赤色にしたいです。
下記のフォームをどのように変えるとよいでしょうか。
ご教示いただけませんでしょうか。

よろしくお願いいたします。


      
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
      <script type="text/javascript" src="jquery.validate.js"></script>
      <script type="text/javascript">
         $.validator.setDefaults({
            submitHandler: function() { alert("submitted!"); }
         });
         $().ready(function() {
            // validate the comment form when it is submitted
            $("#commentForm").validate();
            
            // validate signup form on keyup and submit
            $("#signupForm").validate({
               rules: {
                  firstname: "required",
                  lastname: "required" {
                     required: true,
                     minlength: 2
                  },
                  password: {
                     required: true,
                     minlength: 5
                  },
                  email: {
                     required: true,
                     email: true
                  },
                  email: "正しい「メールアドレス】を入力してください",
               }
            });
            // propose username by combining first- and lastname
            $("#username").focus(function() {
               var firstname = $("#firstname").val();
               var lastname = $("#lastname").val();
               if(firstname && lastname && !this.value) {
                  this.value = firstname + "." + lastname;
               }
            });
          });
      </script>
      
      <style type="text/css">
         form { width:80%; }
         fieldset { margin:10px; padding:10px; }
         p { clear:both; margin:0; padding:0; overflow:hidden; }
         label { width:20em; float:left; display:block; }
         fieldset#newsletter_topics label { display:inline; width:auto; margin-right:10px; }
         textarea, input.txt { margin-right:10px; width:20em; float:left; }
         .error { color:#ff6699; white-space:nowrap; display:inline; }
      </style>
   <body id='example3' class='example'>
      <div id="wrap">
         <h1>サンプル</h1>

         <form id="commentForm" method="get" action="">
            <fieldset>
               <legend>あなたの名前、メールアドレス、住所、コメントを入力してください</legend>
               <p>
                  <label for="cname">名（必須、2文字以上）</label>
                  <input id="cname" name="name" class="txt required" minlength="2" />
               <p>
                  <label for="cemail">メールアドレス（必須）</label>
                  <input id="cemail" name="email" class="txt required email" />
               </p>
               <p>
                  <input class="submit" type="submit" value=" 送信 "/>
               </p>
            </fieldset>
         </form>

エラー時にフォームの色を変えたいです。

validation engineを使って数値の大小を比べ入力制限をしたいと思っています。
例えば以下のようにセレクトボックスA、Bがあるときに、Aで2を選んだら、
Bは3以上でなければアラートが出るという形です。

<select name="A" id="A">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>

<select name="B" id="B">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>

他の入力チェックにvalidation engineを使っており、
出来れば統一して制限をかけられればと思っていますので、宜しくお願い致します。

jQueryValidationEngineで２つのセレクトボックスの大小チェックを入れるには？

タイトルの通りなのですが、laravelのプロジェクトでjqueryのプラグインを使いたいのですが検索しても参考になるものが見つからなかったので質問させていただきます。

japanmapというプラグインを使おうとしています。
/js/jquery-3.4.1.min.jsと/js/japanmap/jquery.japan-map.min.jsはpublicディレクトリのjsフォルダに入っています。
jQuery自体はしっかりと動作するようですがプラグインのメソッドが使えません。

プラグインファイルを置く場所はpublicディレクトリではないのでしょうか。
どなたか知恵をお貸ししていただけたら幸いです。よろしくお願いします。


```html
<script type="text/javascript" src="/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="/js/japanmap/jquery.japan-map.min.js"></script>
<script>
    $(function(){

        $("#map-container").japanMap({
            onSelect : function(data){
                alert(data.name);
            }
        });

    });
</script>
```

デベロッパーツールで見たエラーログはこのような感じです。

```ここに言語を入力
jQuery.Deferred exception: $(...).japanMap is not a function TypeError: $(...).japanMap is not a function
    at HTMLDocument.<anonymous> (http://192.168.33.10:8000/home:27:24)
    at e (http://192.168.33.10:8000/js/jquery-3.4.1.min.js:2:29453)
    at t (http://192.168.33.10:8000/js/jquery-3.4.1.min.js:2:29755) 

Uncaught TypeError: $(...).japanMap is not a function
    at HTMLDocument.<anonymous> (home:27)
    at e (jquery-3.4.1.min.js:2)
    at t (jquery-3.4.1.min.js:2)
```

jQuery Validation Plugin