Having trouble with setting the background color of an input field to red in this code:
$(document).ready(function(){
$(".abc").focus(function(){
$(this).attr('background', 'red');
$("label").text('Insert text here').fadeOut(2000);
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="male">Last name:</label>
<input class="abc" type="text" name="LastName" value=""><br>Make sure to replace attr with css
$(document).ready(function(){
$(".abc").focus(function(){
$(this).css('background-color', 'red');
$("label").text('Text goes here').fadeOut(2000);
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="male">Last name:</label>
<input class="abc" type="text" name="LastName" value=""><br>Instead of using attr() and background, opt for css() and background-color
$(window).ready(function(){
$(".abc").focus(function(){
$(this).css('background-color', 'red');
$("label").text('Text goes here').fadeOut(2000);
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="male">Last name:</label>
<input class="abc" type="text" name="LastName" value=""><br>To steer clear of using JS/Jquery, you can rely solely on CSS to set the color during the focus event.
.abc:focus {
background: red;
}
It is advisable to always separate your styles from the script for better code maintainability.
There is an attribute called Weight : Attribute Code: weight Scope: general Catalog Input Type for Store Owner: Text Field Values Required: yes Apply To: Simple Product, Bundle Product Allow HTML Tags on Frontend: yes Also, there is a General Weight attr ...
My goal is to send a username and password to my backend server. However, I am encountering an issue where the data does not successfully reach the backend when using the following code: function register() { var text = '{"username":"admin1","pass ...
I'm really struggling to grasp the distinction between these two properties. After conducting some research, it appears that justify-content can handle... space-between and space-around, while align-items is capable of... stretch, baseline, initial, a ...
Having two modules that both need access to a shared array can be tricky. One way to handle this is by creating a separate module just for the shared array, like so: sharedArray.js module.exports = []; In your module files, you can then use it like this ...
I'm currently in the process of transitioning a project's backend from JavaScript (Node.js/Express) to TypeScript. However, I've encountered an unusual issue where FS's readFileSync is unable to access the key.pem or cert.pem files in t ...
I have a question, is it possible to include multiple require js files in one file? If so, how can I create objects from them? Calling 'new AllPages.OnePage()' doesn't seem to work. To provide some context, I'm looking for something sim ...
I am attempting to select the 3rd .foo element out of every set of 6. To clarify, here is a brief example: 1 2 3 (this) 4 5 6 1 2 3 (this) 4 5 6 and so on... So far, I have only managed to target every 3rd element, which is not exactly what I need beca ...
In a global object, there are settings that need to be updated based on user input. For instance, if "no" is selected for div 1, not only will div-one be hidden, but the variable's value will also change to 0. The problem lies in the dynamic function ...
Context: I am currently facing a challenge involving the integration of Google search outcomes into a webpage I'm constructing. These findings are presented in XML format. My current approach to importing the XML is as follows: if (window.XMLHttpReq ...
In an effort to modify page titles, I have developed a mixin using document.title and global mixins. The contents of my mixin file (title.ts) are as follows: import { Vue, Component } from 'vue-property-decorator' function getTitle(vm: any): s ...
I'm working on a Ruby-on-Rails project and I want to include a string from the bootstrap datepicker into a hidden field. However, I am unsure of how to reference an input class in this process. Below is the structure of my form: <%= simple_form_f ...
Scenario: I am developing a time picker component for Angular 2. I need to pass values from Angular 2 Components to the jQuery timepicker in order to set parameters like minTime and maxTime. Below is the code snippet: export class TimePicker{ @Input() ...
I am working with divs <div id='top' > <div id='top-border' > </div> <div id='top-menu' > <jdoc:include type="modules" name="top-menu" style="well" /></div> </div> and adjust ...
I am facing an issue where I need to store the text of a referenced element in an array. My goal is to first display the text of each paragraph element with the "ebookName" class in the console before storing it in the array. However, I have encountered a ...
Does anyone know where to find information on the events that are fired for Footable and how to handle them? I checked the documentation at , but it doesn't provide much detail on events. If you have any resources or suggestions, please let me know! ...
https://i.sstatic.net/MbM9f.png I've been working on a nuxt project where I'm currently in the process of creating a map component using Google Maps with the help of the plugin https://www.npmjs.com/package/vue2-google-maps. After installing the ...
Having trouble with loading the css and js on my view: This is how I set up the controller: return view('home.news') ->with("news", $news); And here's how the route is defined: Route::get('/news/{id}&apos ...
In my posts controller, I have implemented a feature where upon updating a post, it redirects to the specific post using an anchor tag. The challenge arises when dealing with pagination through the will_paginate gem. I have set up pagination to display fou ...
My current project involves the following steps: 1. User creates a template with various elements. 2. When the user clicks a button: *The first ajax function establishes a new entry in the custom template database. *The second ajax function retrieves the ...
I experimented with increasing the current value of the 'top' property within a foreach loop. http://jsfiddle.net/fqmnksgL/ var percent = 50; $('div').forEach(function (obj, i) { $(obj).css('top', $(obj).css('top&ap ...