jQuery set fontsize bei Wertänderung Seltsames Verhalten

Ich versuche, die Schriftgröße eines Absatzes mit jQuery und Angular js zu ändern.jQuery set fontsize bei Wertänderung Seltsames Verhalten

Wenn der Benutzer die Schriftgröße ändert, wird die p-Tags Schriftgröße geändert, es funktioniert gut. Aber es gibt einen kleinen Bug, das heißt, wenn der Benutzer den Wert der Schriftgröße ändert, aber wenn er es verringert, wird nicht verringert, sondern erhöht, und umgekehrt und viele dieser Art von ähnlichem Verhalten auftreten.

Dies ist mein Code:

<!DOCTYPE html> 
<html> 

<head> 
      <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
      <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 


     <style> 
      p{ 
       height: 600px; 
       width: 600px; 
       font-size:17px; 
      } 



     </style> 
    </head> 
    <body> 



      <div ng-app="myApp" ng-controller="editor"> 
      <label for="kys_font_size"> font size:</label> 

      <select ng-model="kys_selected_font" id="fontsize" name="kys_font_size" ng-options="page for page in FontSize(1, 150)"> 
       </select> 



      </div> 


    <p contenteditable="true" id="content" > 


     </p> 


     <p></p> 

     <script> 

      var app = angular.module('myApp',[]); 
      app.controller('editor',function($scope){ 

       $scope.FontSize = function(start, end) { 
             var size = []; 
             for (var i = start; i <= end; i++) { 
             size.push(i); 
             } 
          return size; 
         }; 


        $("#fontsize").on('change',function(){ 
          $("#content").css("fontSize",$scope.kys_selected_font+"px"); 

        }); 
      }); 

     </script> 
    </body> 



</html>

Quelle

2016-04-06 Jois

Es wird der alte Wert von dem, was nimmt man ausgewählt. – nisar

wie kann ich das beheben? – Jois

Seine Arbeit ...

Sie haben ng Wechsel verwenden ...

<!DOCTYPE html> 
<html> 

<head> 
      <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
      <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 


     <style> 
      p{ 
       height: 600px; 
       width: 600px; 
       font-size:17px; 
      } 



     </style> 
    </head> 
    <body> 



      <div ng-app="myApp" ng-controller="editor"> 
      <label for="kys_font_size"> font size:</label> 

      <select ng-model="kys_selected_font" id="fontsize" name="kys_font_size" ng-options="page for page in FontSize(1, 150)" ng-change="update()"> 
       </select> 



      </div> 


    <p contenteditable="true" id="content" > 


     </p> 


     <p></p> 

     <script> 

      var app = angular.module('myApp',[]); 
      app.controller('editor',function($scope){ 

       $scope.FontSize = function(start, end) { 
             var size = []; 
             for (var i = start; i <= end; i++) { 
             size.push(i); 
             } 
          return size; 
         }; 

      $scope.update = function(){ 
       $("#content").css("fontSize",$scope.kys_selected_font+"px"); 
      } 



      }); 

     </script> 
    </body> 



</html>

Quelle

2016-04-06 09:38:06 nisar

jQuery set fontsize bei Wertänderung Seltsames Verhalten

Antwort

Verwandte Themen