Stateless Component - Interaction with parent's state

Component.js

import React from 'react';
import TextInput from '../../common/TextInput';
import PropTypes from 'prop-types'; // ES6
import './Add.css';


const AddUrl = ({urlShortForm, saveURLHandler, triggerPreviewURL}) => {
	var _changeInterval = null;

	let onKeyUpAddShortUrlTextInput = function(event) {
		let _this = this;
		// wait untill user type in something
		// Don't let call setInterval - clear it, user is still typing
		clearInterval(_changeInterval);
		_changeInterval = setInterval(function() {
			var regExUrl = /((([A-Za-z]{3,9}:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)/
			if(regExUrl.test(urlShortForm.url)) {
				console.log("ajax")
		        //this function is bind with parents this
				triggerPreviewURL($("#id").val())
				// _this.props.urlMetadataPreviewAction.previewURL(_this.state.urlForm)
			} else {
        		//set state/props
			}
			// Typing finished, now you can Do whatever after 2 sec
			clearInterval(_changeInterval)
		}, 1000);
	}
	return (
		<div className="addUrlContainer">
			<div className="addUrlChildWrapper shadow">
				<span></span>
				<input type="text" placeholder="Add Url" onKeyUp={onKeyUpAddShortUrlTextInput}/>
				<span><i className="fa fa-times" aria-hidden="true"></i></span>
			</div>
		</div>
	);
};

export default AddUrl;

Is it the right way to make a Stateless Child component that triggers a parent's func which gets params using jquery(no state) $("#id").val instead of this.state (stateless component) to pass params?

You shouldn't need to use jQuery to query the DOM. In React, the DOM shouldn't be a source of truth. It should be a projection of app state. So suggest moving the data you're querying from the DOM into to React's state.