JavaScript Android宽度错误

Question

I have some buttons in my android xml layout once I press one of the buttons I called a javascript function to append some text to a 'p' html element in a webview but once the width of the p element becomes wider than the screen width of webview I called the code below to scroll to the end of the p element. 一旦按下按钮之一，我就在android xml布局中有一些按钮，我称之为javascript函数，可将某些文本附加到web视图中的'p'html元素中，但是一旦p元素的宽度变得比webview我调用下面的代码滚动到p元素的末尾。

window.scrollBy(document.getElementById("myp").scrollWidth,0)

But sometimes this code doesn't work properly as it seems that document.getElementById("myp").scrollWidth is getting me the wrong width and I debug the code by using console.log to check the width and it seems that sometimes it is stucking in the same width and not updating with respect to the new text I am adding to the p element. 但是有时这段代码无法正常工作，因为document.getElementById（“ myp”）。scrollWidth似乎为我提供了错误的宽度，并且我通过使用console.log来检查宽度来调试代码，似乎有时停留在相同的宽度，并且不会相对于我要添加到p元素的新文本进行更新。

I also tried using $(document).width() and sometimes also it gets me the wrong width. 我也尝试使用$（document）.width（），有时它还会使我得到错误的宽度。

This is my javascript function included in javascript1.js file which I call: 这是我称为javascript1.js文件中包含的我的javascript函数：

function append(input){

     var element=$('#myp')[0];
     element.innerHTML="$$" + input + "$$";
     window.scrollBy(element.scrollWidth,0);

      M.parseMath(element) ; 
      }

The M.parseMath() is a function I call from a jqmath library for displaying math formulas which works fine as expected. M.parseMath（）是我从jqmath库调用的用于显示数学公式的函数，该函数可以按预期工作。

And the html code is (includes a jquery and jqmath library) 并且html代码是（包括一个jquery和jqmath库）

            <html><head>

            <link rel='stylesheet' href='mathscribe/jqmath-0.4.3.css'>
            <link rel='stylesheet' href='mathscribe/mystyle.css'>

            <meta name="viewport" content="width=device-width, user-      
             scalable=no" />
            <script src='mathscribe/jquery-1.4.3.min.js'></script>
            <script src='mathscribe/jqmath-etc-0.4.3.min.js'></script>



            <script src='mathscribe/javascript1.js'></script>"
            <script src='mathscribe/jquery.js'></script>"  
            </head>
           <body id='mybody'>
           <p id='myp'></p>
           </body>
           </html>

And this is the xml layout: 这是xml布局：

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1">


<WebView
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:id="@+id/webView"

    android:focusableInTouchMode="true"
    android:layout_weight="0.5" />

  <Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="insert"
    android:id="@+id/insertnewtext"
    android:onClick="clickme"
    android:layout_gravity="center_horizontal" />

   <LinearLayout/>

And this is the java code for setting up the webview: 这是用于设置webview的Java代码：

      WebView webView= (WebView) getActivity().findViewById(R.id.webView);
    WebSettings mWebSettings = webView.getSettings();
    mWebSettings.setJavaScriptEnabled(true);

Answer 1

M.parseMath(element) converts the $$...$$ text node inside element to a formatted (2-dimensional) mathematical expression, which changes its width. M.parseMath(element)转换$$...$$内的文本节点element到一个格式化（2维）的数学表达式，这会改变其宽度。 So try doing the window.scrollBy(element.scrollWidth,0); 因此，尝试执行window.scrollBy(element.scrollWidth,0); after the M.parseMath() call, not before, so that element.scrollWidth can give you the correct final element width. 在 M.parseMath()调用之后 M.parseMath()而不是在调用之后 M.parseMath() ，以便element.scrollWidth可以为您提供正确的最终元素宽度。

JavaScript Android宽度错误

问题描述

1 个解决方案

解决方案1
2 2016-04-13 19:15:01

JavaScript Android宽度错误

问题描述

1 个解决方案

解决方案1 2 2016-04-13 19:15:01

解决方案1
2 2016-04-13 19:15:01