以下がbladeの画面です一番下でmian.js(自作クラス)を読み込んでいます。
layoutを使いviewを作成していますが、展開したものを載せています。
php
1 2<!doctype html> 3<html lang="ja"> 4 5<head> 6 <!-- Required meta tags --> 7 <meta charset="utf-8"> 8 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 9 10 <!-- Bootstrap CSS --> 11 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" 12 integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> 13 14 <title>basic2</title> 15 <style> 16 .errormsg { 17 color: #f08080 18 } 19 20 .disabled { 21 pointer-events: none; 22 background-color: #d3d3d3; 23 } 24 25 </style> 26</head> 27 28<body> 29 30 <div class="container"> 31 <form action="/basic1" method="post"> 32 33 <input type="hidden" name="_token" value="jWJDVkEXGt2jdeUzr4MZjQ4HU42X6ndAlDHzO3q0"> 34 35 <form> 36 37 <div class="form-row mt-5"> 38 <div class="form-group col-md-6"> 39 <label for="inputZip" class="font-weight-bold">郵便番号</label> 40 <input type="text" class="form-control" id="inputZip"> 41 </div> 42 <div class="form-group col-md-6"> 43 <label for="inputState" class="font-weight-bold">都道府県</label> 44 <select id="inputState" class="form-control"> 45 <option selected>Choose...</option> 46 <option>...</option> 47 </select> 48 </div> 49 </div> 50 51 52 53 <div class="form-group my-5"> 54 <label for="inputAddress" class="font-weight-bold">以降の住所</label> 55 <input type="text" class="form-control" id="inputAddress" placeholder="1234 Main St"> 56 </div> 57 58 <div class="form-group mb-5"> 59 <label for="inputReason" class="font-weight-bold">知ったきっかけ</label> 60 <select class="custom-select" id="inputReason"> 61 <option selected>Open this select menu</option> 62 <option value="1">One</option> 63 <option value="2">Two</option> 64 <option value="3">Three</option> 65 </select> 66 67 </div> 68 69 <div class="form-group mb-5"> 70 <label for="inputReason" class="font-weight-bold">目的</label> 71 <select class="custom-select" id="inputReason"> 72 <option selected>Open this select menu</option> 73 <option value="1">One</option> 74 <option value="2">Two</option> 75 <option value="3">Three</option> 76 </select> 77 </div> 78 79 <p class="font-weight-bold h6">TOEIC</p> 80 <div class="form-group mb-5"> 81 <div class="custom-control custom-switch custom-control-inline"> 82 <input type="radio" name="toeic" value="have" class="custom-control-input form-control-lg" 83 id="customSwitch1"> 84 <label class="custom-control-label font-weight-bold" for="customSwitch1">受験経験あり</label> 85 </div> 86 <div class="custom-control custom-switch custom-control-inline"> 87 <input type="radio" name="toeic" value="have_not" class="custom-control-input form-control-lg" 88 id="customSwitch2"> 89 <label class="custom-control-label font-weight-bold" for="customSwitch2">受験経験なし</label> 90 </div> 91 </div> 92 93 <div class="form-group mb-5"> 94 <label for="inputResult" class="font-weight-bold">点数</label> 95 <select class="custom-select" id="inputResult"> 96 <option selected>Open this select menu</option> 97 <option value="1">One</option> 98 <option value="2">Two</option> 99 <option value="3">Three</option> 100 </select> 101 </div> 102 103 <p><button type="submit" class="btn btn-primary mb-5">Next</button></p> 104 105 </form> 106 </div> 107 108 <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" 109 integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"> 110 </script> 111 <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" 112 integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"> 113 </script> 114 <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" 115 integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"> 116 </script> 117 <script src="/js/main.js"></script> 118 </body> 119 120</html>
js
1(function() { 2 // 'use strict'; 3 4 //ページが読み込まれた時の処理 5 console.log('AAAAA'); 6 7 //ラジオボタンがクリックされた時の処理 8 $('input[name="toeic"]:radio').change(function() { 9 var radioval = $(this).val(); 10 console.log(radioval); 11 if (radioval == 'have') { 12 $('#inputResult').removeClass('disabled'); 13 } else { 14 $('#inputResult').addClass('disabled'); 15 } 16 }); 17});
ページを読み込んでもエラーはありませんし、main.jsもきちんとsourcesに読み込まれています。
回答3件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/06/12 04:56