在现有的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):

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"]获取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 textfield，然后将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屋！