在现有的 HTML 输入字段中加载图像/徽标 - UIWebView [英] Load image/logo in existing HTML input field - UIWebView

问题描述

因为我是编程新手，所以我做了这样的事情:

as I'm new to programming I've done something like this :

- (void)completeUserFieldsForWebView:(UIWebView *)webView withUsername:(NSString *)username {

// TextField Which has Value "email"
NSString *loadUsernameJS =
[NSString stringWithFormat:@"var inputFields = document.querySelectorAll("input[type='email']"); 
 for (var i = inputFields.length >>> 0; i--;) { inputFields[i].value = '%@';}", username];

// TextField Which has Value "Text" if email is not found
NSString *loadText =
[NSString stringWithFormat:@"var inputFields = document.querySelectorAll("input[type='text']"); 
 for (var i = inputFields.length >>> 0; i--;) { inputFields[i].value = '%@';}", username];
[webView stringByEvaluatingJavaScriptFromString: loadUsernameJS];
[webView stringByEvaluatingJavaScriptFromString: loadText];
}

根据我的输入填充所有文本字段...

Which fill all the text fields according to my input . . .

- (void)completePasswordFieldsForWebView:(UIWebView *)webView withPassword:(NSString *)password {

NSString *loadPasswordJS =
[NSString stringWithFormat:@"var passFields = document.querySelectorAll("input[type='password']"); 
 for (var i = passFields.length>>> 0; i--;) { passFields[i].value ='%@';}", password];
[webView stringByEvaluatingJavaScriptFromString: loadPasswordJS];
}

在 UIWebView 的特定 HTML 页面中填充 Password 参数...

which fills Password parameter in the certain HTML page in the UIWebView . . .

问题是如何在特定文本框中注入自己的图像?

The question is how can I inject my own images in particular textbox ?

尝试 1 号:

  [webView stringByEvaluatingJavaScriptFromString:@"var script = document.createElement('script');"
         "script.type = 'text/javascript';"
         "script.text = "function myFunction() { "
         "var field = document.getElementById('txtAdminPwd');"
         "field.style.backgroundImage='url(icon1.png)';"
         "}";"
         "document.getElementsByTagName('head')[0].appendChild(script);"];

        [webView stringByEvaluatingJavaScriptFromString:@"myFunction();"];

没有成功...

尝试 2 号(@arun's):

Try No. 2(@arun's):

 NSString *cssString = @".login-text-box-bg1{  background-image:url(myProjectName/Arun.png); background-position: right top; background-repeat: no-repeat; background-size: contain; }"; // 1
         NSString *javascriptString = @"var style = document.createElement('style'); style.innerHTML = '%@'; document.head.appendChild(style)"; // 2
        NSString *javascriptWithCSSString = [NSString stringWithFormat:javascriptString, cssString]; // 3
        [webView stringByEvaluatingJavaScriptFromString:javascriptWithCSSString]; // 4

• 本地图像在我的项目之外...

先生，感谢您的努力，但仍未解决通用方法...

Sir, Thanks for the effort but it's Still not solving the Universal Approach. . .

新测试:我可以通过 [inputNode getAttributeNamed:@"id"] [method] 获取 id 或类名2

New Test : i can get id or class name via [inputNode getAttributeNamed:@"id"] [method]2

现在，如果我做这样的事情怎么办

Now, what if I do something like this

 [webView stringByEvaluatingJavaScriptFromString:@"var script = document.createElement('script');"
         "script.type = 'text/javascript';"
         "script.text = "function myFunction() { "
         "var field = document.getElementById('%@');"
         "field.style.backgroundImage = 'url('icon1.png')';"

         "}";"
         "document.getElementsByTagName('head')[0].appendChild(script);",[inputNode getAttributeNamed:@"id"]];

        [webView stringByEvaluatingJavaScriptFromString:@"myFunction();"];

但是它抛出一个错误我们不能传递一个参数吗?离开:

but it's throwing an error can't we pass an argument ?? leave:

我的实际座右铭是在每个输入标签中显示本地图像(通用)

My Actual motto is showing local image into every input tag (Universal)

完成:

 NSString *strJSInjection = [NSString stringWithFormat:@".%@{  background-image:url(https://s29.postimg.org/qqxoigjbr/Arun_Photo.png); background-position: right top; background-repeat: no-repeat; background-size: contain; }",[inputNode getAttributeNamed:@"class"]];

        NSString *cssString = strJSInjection; // 1
         NSString *javascriptString = @"var style = document.createElement('style'); style.innerHTML = '%@'; document.head.appendChild(style)"; // 2
        NSString *javascriptWithCSSString = [NSString stringWithFormat:javascriptString, cssString]; // 3
        [webView stringByEvaluatingJavaScriptFromString:javascriptWithCSSString]; // 4

推荐答案

<input type="text" class="textBox" />

让我们假设上面是你的 HTML 文本字段 然后应用 CSS 来插入图片，试试下面的代码，

Lets assume above is your HTML textfield then apply CSS to this to insert image just try below code,

- (void)webViewDidFinishLoad:(UIWebView *)webView {
    NSString *cssString = @".textBox{  background-image:url(https://s29.postimg.org/qqxoigjbr/Arun_Photo.png); background-position: right top; background-repeat: no-repeat; background-size: contain; }"; // 1
    NSString *javascriptString = @"var style = document.createElement('style'); style.innerHTML = '%@'; document.head.appendChild(style)"; // 2
    NSString *javascriptWithCSSString = [NSString stringWithFormat:javascriptString, cssString]; // 3
    [webView stringByEvaluatingJavaScriptFromString:javascriptWithCSSString]; // 4
}

本地图片文件你可以试试下面的代码片段，

For Local Image file you can try out the below code snippet,

NSString *url = [[NSBundle mainBundle] pathForResource:@"image" ofType:@"png"];
NSString *cssString =  [NSString stringWithFormat:@".textBox{  background-image:url(%@); background-position: right top; background-repeat: no-repeat; background-size: contain; }",url]; // 1

这篇关于在现有的 HTML 输入字段中加载图像/徽标 - UIWebView的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！