jQuery spinner på input

Du skal vel iokke have din class-selector i toppen til '.ButtonClass', men bruge den på ':input' og så lave din click-function på den?

Du skal vel iokke have din class-selector i toppen til '.ButtonClass', men bruge den på ':input' og så lave din click-function på den?

Ikke forstået - sorry :-)

Du har din HTML:

 <div class="selector">
 <input>
 </div>

Javascript

 $(".selector input").on("click", function() {
   $(this).attr("disabled", "disabled");
   $('table').css({ "opacity": "0.5" });
   $('#spinner').show();
   $('#spinner').html('<img src="images/loading.gif" style="width:100px; margin-left:160px; margin-top:50px;" />');
 
 });

csharper. Du har ret, så dette må være metoden (med lidt justeringer på mit img tag):

 <script type="text/javascript">
         $(document).ready(function () {
             $(':input').click(function () {
                 $('#spinner').show();
                 $('#spinner').html('<img src="images/loading.gif" />');
             });
         }); 
     </script>

Det tester jeg lige :-)

Ikke forstået - sorry :-)

Hvis du ser på din kode (linie 3)

 <script type="text/javascript">
         $(document).ready(function () {
             $('.ButtonClass').click(function () {
                 $(':input').attr("disabled", "disabled");
                 $('table').css({ "opacity": "0.5" });
                 $('#spinner').show();
                 $('#spinner').html('<img src="images/loading.gif" style="width:100px; margin-left:160px; margin-top:50px;" />');
             });
        }); 
 </script>

Dette gør at din click kun virker på click på elementer med klassen ButtonClass (.ButtonClass).
Hvis du vil have den til at virke på alle input-elementer skal du erstatte denne selector med en der virker på alle input-elementer.
Så ville mene du skulle lave det således:

 <script type="text/javascript">
         $(document).ready(function () {
             $('$(':input')').click(function () {
                 $(':input').attr("disabled", "disabled");
                 $('table').css({ "opacity": "0.5" });
                 $('#spinner').show();
                 $('#spinner').html('<img src="images/loading.gif" style="width:100px; margin-left:160px; margin-top:50px;" />');
             });
        }); 
 </script>

Koden kan sikkert optimeres med at sende noget med ned i function så din inderste ':input' kan ændres til noget bedre, men desværre er jeg ikke helt skarp nok i hvordan js virker til at jeg kan hjælpe her.

Håber det gav dig lidt mere forståelse af hvad jeg forsøgte at forklare

Jeg nåede lige at fatte hvad du skrev første gang, inden din fine udredning bagefter. Beklager, men nu forstår jeg hvad du mener :-)

hmn måske den skulle ændres lidt:

 <script>
    $(function () {
        $(':input, textarea').on("focus", function (event) {
            $('#spinner')
             .html('<img src="images/loading.gif" />')
             .show();
        });
    }); 
 </script>

@Brian
Godt! Det vigtigste er jo du kom videre med det og fik løst dit problem