How to change the textfield cursor colour in Cordo

2019-05-11 00:54发布

问题:

I have a blue background in my Cordova based iOS project due to which my cursor is not properly visible in iPhone device.So if anyone faced this please tell me How to change the textfield cursor color in Cordova iOS project or if any HTML attribute to change this tint color

textfield code in index.html:

 <input type="text" placeholder="First Name" id='regFName' />

回答1:

To change the color of the cursor, write css for the cursor as follows:

.cursor {
        font-size: 12px;
        background-color: red;
        color: red;
        position: relative;
        opacity: 0.5;
       }


回答2:

Sujania - you just need to add the class "cursor" to your input type.

<input class="cursor" type="text" placeholder="First Name" id='regFName' />

Then the CSS will apply as you would expect!



回答3:

Solution 1: Setting the android:textCursorDrawable attribute to @null should result in the use of android:textColor as the cursor color.

Attribute textCursorDrawable is available in API level 12 and higher


Solution 2: With iOS 7 you can simply change tintColor property of the UITextField. This will affect both the color of the text cursor and the text selection highlight color.

You can do this in code...

textField.tintColor = [UIColor redColor];
... or in Interface Builder:


Solution 3: In your EditText properties, there is an attribute android:textCursorDrawable

Now set it to @null like,

android:textCursorDrawable="@null"

So now your EditText Cursor is same as your EditText TextColor.


Solution 4: Use an image along with CSS cursor property, I don't see any need of JavaScript here...

div {
   cursor: url(YOUR_IMAGE_URL), auto;
}


回答4:

try this ,

for background-color user ur screen background color and for colore use white colore

<style>
 .cursor {
     font-size: 12px;
    background-color: blue;
    color: #fff;
    position: relative;
    opacity: 0.5;
   }
</style>
<input class="cursor " type="text" name="firstname">code here

hope this will work for u!!



回答5:

Try the css attribute caret-color, it's working for me.